Center entry-wrap

Support
#1

Hi!
I want to center the entry-wrap if possible with flexible margins, so margins get 0 in mobile…

I tried (among many other things):

.entry-wrap {
    margin-left: auto !important;
    margin-right: auto !important;
}

without any effect. I can set a constant margin that stays in mobile but a “responsive one” would be best.

cheers!

#2

Hello There,

Thanks for writing in! It may not be margins in mobile screens. It is padding. Please update your code and make use of this instead:

.entry-wrap {
    margin-left: auto !important;
    margin-right: auto !important;
}

@media(max-width: 767px){
  .entry-wrap {
    padding: 5px !important;
  }
}

We would loved to know if this has work for you. Thank you.

#3

thank you very much for your reply!

2 things:

  1. I just noticed that in safari and firefox the code works (and probably did before). In chrome the “margin:auto” does not apply for some mysterious reason.

  2. what I want to achieve is that on this site (www.overhead.at) the entry-wrap and the right sidebar are closer together and more in the center of the page. the “auto-margin-way” was a way to try that…

#4

Hi There,

Thank you for sharing the URL. I can see where you’re at. That will not work for what you want to achieve. By default, the left content container should stay on the left, it’s current width is 62.536945%. Right sidebar width is 32.536945% which is set to stay on the right. It should be 100%. When you add the width of those left content and sidebar width, the different from 100% is the space you were seeing in the middle.

To achieve what you want, go to Pro > Launch > Theme Options > Layout and Design: Adjust Site Maxwidth and CONTENT WIDTH (%) accordingly. No need for custom CSS.

#5

ahhhh… got that thanks!

now is there a way to set the sidebar to a specific max-width and then let it float next to the left (within the sidebar-range)?

#6

Hi,

Yes, you can do that using Custom css code.

You can try adding the code below in PRO > Launch > THEME Options > CSS

body .x-sidebar.right {
    float:left;
    max-width:300px;
    margin-left:30px !important;
}

You may change the values to achieve your desired look.

Hope that helps.

#7

awesome! works like a charm; thank you all!

#8

You’re welcome! :slight_smile: