Home>Support>Single Row Width

Single Row Width

By Zach Bradshaw, 9 years ago. Last reply by Magus, 9 years ago.

Is there a way that I can shrink the tabbed section of my homepage down horizontally?

I would like perhaps a 25% padding so that there is less open space inside the tab box.

And how would this effect the mobile version of the site (where the tabs seem perfectly sufficient as is)?

Also, css rules I apply to the row do not seem to penetrate the tab box ( I tried to make the text larger and teal, got it to work for text in the same tinymce widget, but not inside the shortcode)

URL: http://seogreensboro.zachbradshaw.com/

This is our free support forum. Replies can take several days. If you need fast email support, please purchase a SiteOrigin Premium license.

  1. 9 years, 3 months ago Magus
    Hi, I Work Here

    Hi Zach

    Please try this. Edit the Visual Editor widget and centre align the shortcode. Then please add the to Appraeance->Custom CSS.

    .tada.su-animate {
        max-width: 640px;
    }
    

    Adjust the width as desired

    Magus

  2. 9 years, 3 months ago Magus
    Hi, I Work Here

    In reference to the second question the tabs use their own CSS so you would not be able to target them using the CSS options in the widget or row.

    please try adding this

    .su-tabs-pane {
        font-size: 16px !important;
        color: teal;
    }
    

    Adjust as required again

    Magus

  3. 9 years, 2 months ago Zach Bradshaw

    Thanks Magus,

    Sorry for the late reply… But I’ve changed the layout a bit. At some point, I had the text in that box looking how I wanted it. But since it has reverted back down to size. Do you have any new suggestions on what I should do?

    Thanks again for your help.

  4. 9 years, 2 months ago Zach Bradshaw

    And Oh yea! I have moved the site to http://greensboroseopro.com

  5. 9 years, 2 months ago Magus
    Hi, I Work Here

    Hi Zach

    Please remove the last tabs entry from your custom CSS

    .tabs {
    font-size: 16px !important;
    }
    

    This entry is being overridden by a more specific entry. Please add the following, it should give you the layout you want

    #panel-6-7-0-0 {
        padding: 0 10px;
    }
    #pgc-6-7-1 {
        width: 55% !important;
    }
    #pgc-6-7-0 {
        width: 45% !important;
    }
    
    .tabs, .su-tabs-pane {
        font-size: 16px !important;
    }
    

    Let us know how it goes

    Magus

  6. 9 years, 2 months ago Zach Bradshaw

    Thanks Magus. Worked like a charm. Thanks again!

  7. 9 years, 2 months ago Magus
    Hi, I Work Here

    No worries Zach

    If you need any more help please feel free to open a new support thread.

    Magus

Replies on this thread are closed. Please create a new thread if you have a question, or purchase a SiteOrigin Premium license if you need one-on-one email support.

Get The Most Out of SiteOrigin with SiteOrigin Premium

Find Out More