spike-spiegel Posted January 27, 2014 Share Posted January 27, 2014 Look http://lucrebem.com.br/empreendedorismo-online, my left side bar is below everything, I searched the whole css and can't seem to find a solution. Quote Link to comment https://forums.phpfreaks.com/topic/285724-my-layout-is-broken-and-i-cant-find-the-solution/ Share on other sites More sharing options...
adam_bray Posted January 28, 2014 Share Posted January 28, 2014 It'll be down to the margin's you're setting. You've structured the page in a hard-to-follow way. Really what you should be doing is setting 1 containing element, 1 float left + width, 1 float right + width. Something along the lines of this - .wrapper { display: block; width: 1030px; } .wrapper:after { clear: both; content: "."; display: block; height: 1px; visibility: hidden; } .left { display: block; float: left; width: 710px; } .right { display: block; float: right; width: 310px; } <div class="wrapper"> <div class="left">Left content</div> <div class="right">Right content</div> </div> Quote Link to comment https://forums.phpfreaks.com/topic/285724-my-layout-is-broken-and-i-cant-find-the-solution/#findComment-1466833 Share on other sites More sharing options...
spike-spiegel Posted January 28, 2014 Author Share Posted January 28, 2014 You mean there should be only left or right, and not both? Quote Link to comment https://forums.phpfreaks.com/topic/285724-my-layout-is-broken-and-i-cant-find-the-solution/#findComment-1466863 Share on other sites More sharing options...
adam_bray Posted January 29, 2014 Share Posted January 29, 2014 No, the example has both. Looking through your code you have lots of different container elements doing similar things, then you use margins to push the columns into place. This method is causing the right column to act in a way you don't expect. The code above is a simple version of what you're trying to do. Quote Link to comment https://forums.phpfreaks.com/topic/285724-my-layout-is-broken-and-i-cant-find-the-solution/#findComment-1466915 Share on other sites More sharing options...
spike-spiegel Posted January 30, 2014 Author Share Posted January 30, 2014 No, the example has both. Looking through your code you have lots of different container elements doing similar things, then you use margins to push the columns into place. This method is causing the right column to act in a way you don't expect. The code above is a simple version of what you're trying to do. This is a template, I didn't create it..... Quote Link to comment https://forums.phpfreaks.com/topic/285724-my-layout-is-broken-and-i-cant-find-the-solution/#findComment-1467144 Share on other sites More sharing options...
raju596 Posted January 31, 2014 Share Posted January 31, 2014 :after clear: both; please clarify this plz ..... Quote Link to comment https://forums.phpfreaks.com/topic/285724-my-layout-is-broken-and-i-cant-find-the-solution/#findComment-1467190 Share on other sites More sharing options...
adam_bray Posted January 31, 2014 Share Posted January 31, 2014 the :after selector adds content after the specified element. The code provided adds an invisible "." below the contained content to act as a clearfix when using floated elements. Quote Link to comment https://forums.phpfreaks.com/topic/285724-my-layout-is-broken-and-i-cant-find-the-solution/#findComment-1467222 Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.