Forcing Breakpoint of Row

katethornell

Hi there,

I am just having an issue with some boxed elements in my widgetized sidebar looking weird and crappy when the screen size is about 800px or below wide.

I have a row setup 3/4 + 1/4 and the widgetized sidebar is in the last 1/4.

I want to force that last 1/4 to drop below the Content when it gets to 850px or less. How do I do this?

Thanks in advance for any assistance.

Air

Hello

Could you show live link to problematic page?
Also please refer to your previous topic, I have shown you there place where can you change breakpoint width or add another one - http://support.apollo13.eu/discussion/2436/how-to-create-a-custom-breakpoint-for-sidebar-to-appear-below-the-main-content-#Item_2

With regards.

katethornell

Hi, Preview to page is here: http://27.131.66.9/~whetston/awning/

It is actually the widgitized sidebar within a page row of 3/4 + 1/4. As you can see when you bring the page down to 800 pixels the widgetized sidebar looks too small. I want it to dropdown before this, it is currently dropping down at 770.

Air

So this is more like columns problem. In \wp-content\plugins\js_composer\assets\css\js_composer_front.css you have

@media (min-width: 768px) {
  .vc_responsive .wpb_row .vc_span1 {
    float: left;
    width: 8.333333333333332%;
  }
}
.vc_responsive .wpb_row .vc_span2 {
  position: relative;
  min-height: 1px;
  padding-left: 15px;
  padding-right: 15px;
}
@media (min-width: 768px) {
...

You will either have to change that 768. There is 12 of such rules(12 places to change).

With regards.