Tagged: 

Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • February 4, 2015 at 11:49 pm #391014
    millertimesites

    I am switching my popular travel website over to Enfold but am having issues with the sidebar spacing and behavior.

    When I have a Right Side Bar everything works perfect, however, I only want a right sidebar on about 1/4 of the pages since Left Side Bars preform better with AdSense.
    When I switch to a Left Side Bar the side margins/padding on the main content area get really weird even though the content row settings for both of the pages is Enfold default. Also the sidebar content goes over the main content in responsive mode with a Left Side Bar but not with a Right Side Bar.

    Any idea on how to fix this?
    I will make a private comment with the links to the example pages.
    Thanks a ton
    Jon

    February 5, 2015 at 12:29 pm #391249
    Yigit

    Hey Jon!

    Please add following code to Quick CSS in Enfold theme options under General Styling tab

    .sidebar_left .content { margin-right: 0; }

    Regards,
    Yigit

    February 5, 2015 at 6:19 pm #391515
    millertimesites

    Thanks that did help out quite a bit, but still having some issues.

    When I use a Right Side Bar the inner margins/padding of the Side Bar are exactly how I want them as it is only a couple pixels on each side. The margins of the Main Content when using this layout are 20px on the left which I set, but the right edge is still has a 45px margin no matter what I do.

    When I switch to a Left Side Bar the inner margins/padding of the Side Bar are 20px on the left and 45px which is way different. The margins of the Main Content when using this layout are 45px on both the right and left.

    Here is the Quick CSS I have added in for the margins including what you provided above:

    .inner_sidebar {margin-left: 5px; margin-right: 5px; padding: 0px;}
.sidebar_left .content { margin-right: 0; }

.container {padding: 0px 10px;}
.boxed .container {margin: 0px 10px;}

    In the end I would like for the sidebar to have almost no inner margins and for the Main Content to have margins on between 20 to 25px regardless on whether the Side Bar is on the left or right.

    Thanks
    Jon

    February 6, 2015 at 12:39 pm #391975
    Ismael

    Hey!

    Use this to remove the right margin of the left sidebar:

    .sidebar_left .inner_sidebar {
margin-right: 10px;
margin-left: 0;
}

    Adjust the content padding with this:

    .sidebar_left .content {
padding-left: 20px;
}

    Regards,
    Ismael

    February 8, 2015 at 7:37 am #392644
    millertimesites

    Thank you that is exactly what I needed.

    Another related question. Right now I have the responsive width settings to be 25% sidebar and 75% content. Is there a way to force the ratio to change with the screen size so on screens 700-900 and can have it be 30% to 70% instead? This would help to stop my 300px wide ads from getting cut off or overlapping the content.

    Thanks
    Jon

    February 9, 2015 at 5:23 pm #393160
    Yigit

    Hey!

    Please add following code to Quick CSS as well

    @media only screen and (max-width: 900px) and (min-width: 700px) {
.container .av-content-small.units {
width: 70% !important;
}}

    Best regards,
    Yigit

    March 2, 2015 at 6:41 am #404309
    millertimesites

    As I have been building out the test pages to this site the solution you provided seems to work great.
    The theme does try to align the widget titles toward the content (left on left side bar and right on right side bar) but otherwise it fixed the issues I had

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘How to fix enfold sidebar spacing’ is closed to new replies.