Twenty Eleven child theme CSS style 5 widgets to footer
-
Hi
This issue relates to my previous Topic I posted yesterday, adding five widgets to the footer of Twenty Eleven child theme cannot style them so they appear side by side across the footer
Alchymyth’s solution form my previous topic improved the layout which is much better , however one and two are now stacked.
#supplementary.four .widget-area { float: left; margin-right: 3.7%; width: 22.18%; } #supplementary.four .widget-area + .widget-area + .widget-area + .widget-area { margin-right: 0; } and #supplementary.five .widget-area { float: left; margin-right: 2.7%; width: 17.78%; } #supplementary.five .widget-area + .widget-area + .widget-area + .widget-area + .widget-area { margin-right: 0; }
Produced the Result below
one
two
three four five
However still having issues getting them side by side below is the result I need across the footer
one two three four five
below is the CSS I have so far, does anyone know where I am going wrong? I keep reducing the width for .two and .three but one and two are stacked and three four and five display correctly side by side the class .five does get picked up by the switch statement and appears in firebug so the class .five is being used. I am currently using Alchymyth’s solution for .five class see above
Hope someone can help? Thanks in advance
/* =Footer
———————————————– */#colophon { clear: both; } #supplementary { border-top: 1px solid #ddd; padding: 1.625em 7.6%; overflow: hidden; } /* Two Footer Widget Areas */ #supplementary.two .widget-area { float: left; margin-right: 3.7%; width: 18.62%; } #supplementary.two .widget-area + .widget-area { margin-right: 0; } /* Three Footer Widget Areas */ #supplementary.three .widget-area { float: left; margin-right: 3.7%; width: 18.62%; } #supplementary.three .widget-area + .widget-area + .widget-area { margin-right: 0; }
- The topic ‘Twenty Eleven child theme CSS style 5 widgets to footer’ is closed to new replies.