• Hello, I would like to fix my widgets. I have tried to edit the padding and the margins of the textboxes but it doesn’t seem to work. I am trying to make it so there is no space in between the textboxes so it looks more clean on the website. Please let me know how I can do this? I am using Headway.
    Here is the picture of the margins I want fixed.

    Here is the code for the widget in case it is needed:

    <html style="margin:0;padding:0;height:100%">
    <head>
    <meta content="text/html; charset=UTF-8" http-equiv="Content-Type" />
    <style type="text/css">
    .beta-base .preheader, .beta-base .header, .beta-base .sidebar, .beta-base .body, .beta-base .footer, #mainContent {
        text-align: left;
    }
    .beta-base .preheader, .beta-base .header, .beta-base .body, .beta-base .sidebar, .beta-base .leftSidebar, .beta-base .rightSidebar, .beta-base .footer {
        margin: 0;
        padding: 0;
        border: none;
        white-space: normal;
        line-height: normal;
    }
    .beta-base .title, .beta-base .subtitle, .beta-base .text, .beta-base img {
        margin: 0;
        padding: 0;
        background: none;
        border: none;
        white-space: normal;
        line-height: normal;
    }
    .beta-base .bodyContainer td.preheader{
        padding: 1px 0;
    }
    .beta-base .bodyContainer td.header {
        padding: 0;
        height: 0px;
    }
    .beta-base .bodyContainer td.body, .beta-base .bodyContainer td.footer,
    .beta-base .bodyContainer td.sidebar, .beta-base .bodyContainer td.leftSidebar, .beta-base .bodyContainer td.rightSidebar {
        padding: 1px;
    }
    .beta-base .bodyContainer td.header p, .beta-base .bodyContainer td.preheader p, .beta-base .bodyContainer td.body p,
    .beta-base .bodyContainer td.footer p, .beta-base .bodyContainer td.sidebar p,
    .beta-base .bodyContainer td.leftSidebar p, .beta-base .bodyContainer td.rightSidebar p {
        margin: 0;
        color: inherit;
    }
    .beta-base .bodyContainer td.header div.title, .beta-base .bodyContainer td.preheader div.title, .beta-base .bodyContainer td.body div.title,
    .beta-base .bodyContainer td.footer div.title, .beta-base .bodyContainer td.sidebar div.title,
    .beta-base .bodyContainer td.leftSidebar div.title, .beta-base .bodyContainer td.rightSidebar div.title,
    .beta-base .bodyContainer td.header div.subtitle, .beta-base .bodyContainer td.preheader div.subtitle, .beta-base .bodyContainer td.body div.subtitle,
    .beta-base .bodyContainer td.footer div.subtitle, .beta-base .bodyContainer td.sidebar div.subtitle,
    .beta-base .bodyContainer td.leftSidebar div.subtitle, .beta-base .bodyContainer td.rightSidebar div.subtitle,
    .beta-base .bodyContainer td.header div.text, .beta-base .bodyContainer td.preheader div.text, .beta-base .bodyContainer td.body div.text, .beta-base .bodyContainer td.body div.text div,
    .beta-base .bodyContainer td.footer div.text, .beta-base .bodyContainer td.sidebar div.text,
    .beta-base .bodyContainer td.leftSidebar div.text, .beta-base .bodyContainer td.rightSidebar div.text {
        overflow: auto;
    }
    .beta-base .optout {
        margin-bottom: 0px;
        margin-top: 0px;
    }
    div.infusion-captcha {
        width: 220px;
        padding: 1px;
    }
    div.infusion-captcha input, div.infusion-captcha select, div.infusion-captcha textarea {
        width: 95%;
        display: inline-block;
        vertical-align: middle;
    }
    table.infusion-field-container td.infusion-field-input-container input[type='text'],
    table.infusion-field-container td.infusion-field-input-container input[type='password'],
    table.infusion-field-container td.infusion-field-input-container textarea {
        width: 98%; /* must be 98% to make the snippet-menu line up due to border width */
        margin: 0;
    }
    table.infusion-field-container td.infusion-field-input-container select {
        width: 101%;
        *width: 102%; /* this one for IE */
        margin: 0;
    }
    table.infusion-field-container td.infusion-field-label-container {
        padding-right: 5px;
    }
    td.header .image-snippet img {
        vertical-align: bottom;
    }
    #webformErrors {
        color: #990000;
        font-size: 14px;
    }
    html, body {
        margin: 0;
        padding: 0;
        height: 100%;
    }
    .infusion-form {
        margin: 0;
        height: 100%;
    }
    .infusion-option {
        display: block;
        text-align: left;
    }
    </style>
    <style type="text/css">
    .beta-font-b h1, .beta-font-b h2, .beta-font-b h3, .beta-font-b h4, .beta-font-b h5, .beta-font-b h6 {
        font-family: arial,sans-serif;
    }
    .beta-font-b h1 {font-size: 24px;}
    .beta-font-b h2 {font-size: 20px;}
    .beta-font-b h3 {font-size: 14px;}
    .beta-font-b h4 {font-size: 12px;}
    .beta-font-b h5 {font-size: 10px;}
    .beta-font-b h6 {font-size: 8px;}
    .beta-font-b address {font-style: italic;}
    .beta-font-b pre {font-family: Courier New, monospace;}
    .beta-font-b .title, .beta-font-b .title p {
        font-size: 20px;
        font-weight: bold;
        font-family: arial,sans-serif;
    }
    .beta-font-b .subtitle, .beta-font-b .subtitle p {
        font-size: 11px;
        font-weight: normal;
        font-family: arial,sans-serif;
    }
    .beta-font-b .text, .beta-font-b p {
        font-size: 12px;
        font-family: arial,sans-serif;
    }
    .beta-font-b .preheader .text, .beta-font-b .preheader .text p {
        font-size: 11px;
        font-family: arial,sans-serif;
    }
    .beta-font-b .footer a {
        font-size: 11px;
        font-family: arial,sans-serif;
    }
    .beta-font-b .footer .text {
        font-size: 10px;
        font-family: verdana,sans-serif;
    }
    .beta-font-b .sidebar .title, .beta-font-b .leftSidebar .title, .beta-font-b .rightSidebar .title {
        font-size: 15px;
        font-weight: bold;
        font-family: arial,sans-serif;
    }
    .beta-font-b .sidebar .subtitle, .beta-font-b .leftSidebar .subtitle, .beta-font-b .rightSidebar .subtitle {
        font-size: 12px;
        font-family: arial, sans-serif;
    }
    .beta-font-b .sidebar .text, .beta-font-b .sidebar .text p, .beta-font-b .leftSidebar .text, .beta-font-b .rightSidebar .text {
        font-size: 11px;
        font-family: arial, sans-serif;
    }
    .infusion-field-label-container {
        font-size: 14px;
        font-family: arial,sans-serif;
    }
    .infusion-field-input-container {
        color: #000000;
        font-size: 12px;
    }
    .infusion-option label {
        color: #000000;
        font-size: 14px;
        font-family: arial,sans-serif;
    }
    </style>
    <style type="text/css">
    .custom-35 .background{
    background-color:#FFFFFF;
    }
    .custom-35 .body{
    background-color:#FFFFFF;
    }
    .custom-35 a{
    color:#E81809;
    }
    .custom-35 .text{
    color:#000000;
    }
    .custom-35 .background .preheader a{
    color:#0645ad;
    }
    .custom-35 .background .preheader .text{
    color:#1a242e;
    }
    .custom-35 .title{
    color:#1A242E;
    }
    .custom-35 .header{
    background-color:#FFFFFF;
    }
    .custom-35 .subtitle{
    color:#000000;
    }
    .custom-35 .sidebar .title{
    color:#000000;
    }
    .custom-35 .leftSidebar .title{
    color:#000000;
    }
    .custom-35 .sidebar .subtitle{
    color:#000000;
    }
    .custom-35 .leftSidebar .subtitle{
    color:#000000;
    }
    .custom-35 .footer{
    background-color:#FFFFFF;
    }
    .custom-35 .rightSidebar .title{
    color:#000000;
    }
    .custom-35 .footer a{
    color:#0645AD;
    }
    .custom-35 .rightSidebar .subtitle{
    color:#000000;
    }
    .custom-35 .footer .text{
    color:#000000;
    }
    .custom-35 .infusion-field-label-container{
    color:#000000;
    }
    .custom-35 .infusion-field-label-container{
    font-size:16px;
    }
    .custom-35 .infusion-field-label-container{
    font-family:Georgia;
    }
    .custom-35 .infusion-field-input-container{
    font-size:16px;
    }
    .custom-35 .infusion-option label{
    color:#000000;
    }
    .custom-35 .infusion-option label{
    font-size:14px;
    }
    .custom-35 .infusion-option label{
    font-family:Arial;
    }
    .custom-35 .webFormBodyContainer{
    border-style:Hidden;
    }
    .custom-35 .webFormBodyContainer{
    border-width:0px;
    }
    .custom-35 .webFormBodyContainer{
    border-color:#000000;
    }
    </style>
    <style type="text/css">
    .bodyContainer {
    width:300px;
    }
    .infusion-field-input-container {
    width:150px;
    }
    .rightSidebar {
    width:340px;
    }
    .leftSidebar {
    width:190px;
    }
    .infusion-field-label-container {
    text-align:Center;
    }
    .infusion-field-label-container {
    vertical-align:Middle;
    }
    .infusion-field-input-container {
    width:150px;
    }
    </style>
    <script src="https://vx152.infusionsoft.com/app/webTracking/getTrackingCode?trackingId=2c1c322d11af5873de1bfd67678a623b" type="text/javascript">
    </script>
    </head><body leftmargin="0" marginheight="0" marginwidth="0" offset="0" style="margin-bottom: 0px; margin-top: 0px">
    <form accept-charset="UTF-8" action="https://vx152.infusionsoft.com/app/form/process/90b117b987db88c704277c40938447e3" class="infusion-form" method="POST" name="Sales Page Opt In -
    Open Studio" onsubmit="var form = document.forms[0];
    var resolution = document.createElement('input');
    resolution.setAttribute('id', 'screenResolution');
    resolution.setAttribute('type', 'hidden');
    resolution.setAttribute('name', 'screenResolution');
    var resolutionString = screen.width + 'x' + screen.height;
    resolution.setAttribute('value', resolutionString);
    form.appendChild(resolution);
    var pluginString = '';
    if (window.ActiveXObject) {
        var activeXNames = {'AcroPDF.PDF':'Adobe Reader',
            'ShockwaveFlash.ShockwaveFlash':'Flash',
            'QuickTime.QuickTime':'Quick Time',
            'SWCtl':'Shockwave',
            'WMPLayer.OCX':'Windows Media Player',
            'AgControl.AgControl':'Silverlight'};
        var plugin = null;
        for (var activeKey in activeXNames) {
            try {
                plugin = null;
                plugin = new ActiveXObject(activeKey);
            } catch (e) {
                // do nothing, the plugin is not installed
            }
            pluginString += activeXNames[activeKey] + ',';
        }
        var realPlayerNames = ['rmockx.RealPlayer G2 Control',
            'rmocx.RealPlayer G2 Control.1',
            'RealPlayer.RealPlayer(tm) ActiveX Control (32-bit)',
            'RealVideo.RealVideo(tm) ActiveX Control (32-bit)',
            'RealPlayer'];
        for (var index = 0; index < realPlayerNames.length; index++) {
            try {
                plugin = new ActiveXObject(realPlayerNames[index]);
            } catch (e) {
                continue;
            }
            if (plugin) {
                break;
            }
        }
        if (plugin) {
            pluginString += 'RealPlayer,';
        }
    } else {
        for (var i = 0; i < navigator.plugins.length; i++) {
            pluginString += navigator.plugins[i].name + ',';
        }
    }
    pluginString = pluginString.substring(0, pluginString.lastIndexOf(','));
    var plugins = document.createElement('input');
    plugins.setAttribute('id', 'pluginList');
    plugins.setAttribute('type', 'hidden');
    plugins.setAttribute('name', 'pluginList');
    plugins.setAttribute('value', pluginString);
    form.appendChild(plugins);
    var java = navigator.javaEnabled();
    var javaEnabled = document.createElement('input');
    javaEnabled.setAttribute('id', 'javaEnabled');
    javaEnabled.setAttribute('type', 'hidden');
    javaEnabled.setAttribute('name', 'javaEnabled');
    javaEnabled.setAttribute('value', java);
    form.appendChild(javaEnabled);">
    <input name="inf_form_xid" type="hidden" value="90b117b987db88c704277c40938447e3" /><input name="inf_form_name" type="hidden" value="Sales Page Opt In -
    Open Studio" /><input name="infusionsoft_version" type="hidden" value="1.32.0.59" />
    <div class="custom-35 beta-base beta-font-b" id="mainContent" style="height:100%">
    <table cellpadding="0" cellspacing="0" class="background" style="width: 100%; height: 100%">
    <tbody>
    <tr>
    <td align="center" valign="top">
    <table cellpadding="0" cellspacing="0" class="bodyContainer">
    <tbody>
    <tr>
    <td class="header" colspan="2" sectionid="header">
    <div class="text" id="webformErrors" name="errorContent">
    </div>
    <div>
    <div style="height:15px; line-height:0px;">
    ?
    </div>
    </div>
    <div>
    <div class="authoring-image image-snippet" contentid="image">
    <div class="authoring-image image-snippet" contentid="image">
    <div class="imageSnippet-alignDiv" style="text-align: left;">
    <img align="bottom" alt="Own Your Own Studio" border="0" class="simage" height="200" src="https://d1yoaun8syyxxt.cloudfront.net/vx152-a4de168a-3a29-4e40-95a1-819ab2d9ee62-v2" style="margin-left: 0px; margin-right: 0px;" title="Own Your Own Studio" width="324" />
    </div>
    </div>
    </div>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    <table bgcolor="#FFFFFF" cellpadding="0" cellspacing="0" class="bodyContainer">
    <tbody>
    <tr>
    <td class="body" sectionid="body" valign="top">
    <div>
    <div style="height:15px; line-height:15px;">
    ?
    </div>
    </div>
    <div>
    <table class="infusion-field-container">
    <tbody>
    <tr>
    <td class="infusion-field-input-container" style="width:150px;">
    <input class="infusion-field-input-container" placeholder="First Name *" id="inf_field_FirstName" name="inf_field_FirstName" type="text" />
    </td>
    </tr>
    </tbody>
    </table>
    </div>
    <div>
    <table class="infusion-field-container">
    <tbody>
    <tr>
    <td class="infusion-field-input-container" style="width:150px;">
    <input class="infusion-field-input-container" placeholder="Email *" id="inf_field_Email" name="inf_field_Email" type="text" />
    </td>
    </tr>
    </tbody>
    </table>
    </div>
    <div>
    <table class="infusion-field-container">
    <tbody>
    <tr>
    <td class="infusion-field-input-container" style="width:150px;">
    <input class="infusion-field-input-container" placeholder="Phone *" id="inf_field_Phone1" name="inf_field_Phone1" type="text" />
    </td>
    </tr>
    </tbody>
    </table>
    </div>
    <div>
    <div style="height:1px; line-height:1px;">
    ?
    </div>
    </div>
    <div>
    <div class="infusion-submit" style="text-align:center;">
    <button style="width:200px; height:50px; background-color:#3DC0C0; color:#FFFFFF; font-size:30px; font-family:Georgia; border-color:#000000; border-style:Hidden; border-width:1px; -moz-border-radius:6px;border-radius:6px;" type="submit" value="Get It Now!">Get It Now!</button>
    </div>
    </div>
    <div>
    <div class="text">
    <div class="text" contentid="paragraph">
    <div>
    ?
    </div>
    </div>
    </div>
    </div>
    </td>
    </tr>
    </tbody>
    </table>
    </td>
    </tr>
    </tbody>
    </table>
    </div>
    </form>
    </body>
    </html>

Viewing 5 replies - 1 through 5 (of 5 total)
  • Is your site online? Can you post a link to the url?

    Thread Starter UnknownKnowledge

    (@unknownknowledge)

    .beta-base .bodyContainer td.body {
     padding:0;
    }
    table .infusion-field-container {
      margin-bottom:0;
    }

    And add this to your button styling:

    padding: 5px 0px;

    Make sure you put your CSS changes in a custom CSS file.

    Thread Starter UnknownKnowledge

    (@unknownknowledge)

    Thanks! So I put this:

    .beta-base .bodyContainer td.body {
     padding:0;
    }
    table .infusion-field-container {
      margin-bottom:0;
    }

    in a custom file and make a reference to it in my widget?

    No you need to put the code into a Custom CSS file. The reason you want to do this is because if you update the theme your style changes will be overwritten if you put it in the main styles.css.

    There are several ways to do this:
    JetPack has a custom.css file
    Install a custom css plugin
    Create a child theme
    Some themes come with a custom css file.

    You don’t have to put it in your widget.

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Headway, widgets issue’ is closed to new replies.