Site logo

Archived topic

Equal length columns

89 replies · Started by Anonymous on August 20, 2014

Viewing posts 61–75 of 90

Awesome, glad you figured it out. Thanks for sharing the solution :)

Hi,

Sorry to jump on this thread again, but I'm having similar issues with a site I'm working on. The code works fine on the home page where the content would normally be shorter than the sidebar, but on a page where the reverse is true the sidebar isn't aligning with the content.

Working homepage: http://cccbrdev.kcacrpublicity.org.uk

Not working other page: http://cccbrdev.kcacrpublicity.org.uk/what-is-bell-ringing/

Any help or advice appreciated.

Thanks,
Doug.

Hi Doug,

Unfortunately it won't work this way - the sidebar needs to have a solid color in order to match the longer content.

For it to work with your setup, that last widget would have to increase in height to match, which isn't possible.

Hello all,

I would like to know if it is possible to have equal length columns (content and sidebar) on my site http://www.bluemonty.de. I tried this: https://gist.github.com/generatepress/b946892d810435352fd9 but it doesn't work. When I choose the option "One Container", sidebar and content have the same length. But I want to have several containers with round corners and a little distance between the containers, just like at present.

Can anybody help me?

Best wishes from Birgit

The equal height columns script only works if both containers have a solid color.

If you want to re-add the script and let me know, I might be able to help out with some CSS.

Hi Tom,

I just re-add the script and I would be very glad if you helped me.

Thank you so much
Birgit

So sorry, Tom, it seems I didn't save that hook. Now it is re-added and saved, really. ;-) And the widgets have no more rounded corners.

It's not showing up for me yet - you might have to clear your cache inside your caching plugin.

Cache is cleared now und cookies are deleted but it seems it's still not showing up.

Got the sidebar's corners round now, looks great! Don't need the distances between the widgets any more. Only the equal length is missing.

Sorry, IE and Edge don't show the rounded corners...

There we go :)

Now you need to add the background and border radius to the element with the height:

.site-main {
    background: #FFF;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

Border radius using CSS3, which IE isn't cool enough to really recognize. EDGE should be though: http://caniuse.com/#feat=border-radius

I hope I do not nerve but I got the round widget-corners now even in IE and Edge. I used this code:

background: #ffffff;
background: -webkit-gradient(linear, 0 0, 0 bottom, from(#ffffff), to(#ffffff));
background: -webkit-linear-gradient(#ffffff, #ffffff);
background: -moz-linear-gradient(#ffffff, #ffffff);
background: -ms-linear-gradient(#ffffff, #ffffff);
background: -o-linear-gradient(#ffffff, #ffffff);
background: linear-gradient(#ffffff, #ffffff);
-pie-background: linear-gradient(#ffffff, #ffffff);

This archived topic is closed to new replies.