homepage Welcome to WebmasterWorld Guest from
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Become a Pro Member

Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

2 blocks responsive design outlining

 9:06 am on Aug 13, 2013 (gmt 0)

On top of the page i have a menu block including a logo lined out on the right.

Underneath this block i have the content block.
If i resize the browser window, the content block doesn't stick to the left side of the window but moves to the right next to the menu-block out of sight.

What is the way to go here?

a small piece of it (the basic) i copy/pasted here:

#logo {
max-width: 50%;
#menu_block {
display: block;
border:1px solid green;

#container {
display: block;
position: relative;
border: 1px solid #666;
padding: 5px;
margin-bottom: 20px;

.clearfix:before, .clearfix:after { content: ""; display: table; }
.clearfix:after { clear: both; }
.clearfix { zoom: 1; }

<section id="options" class="clearfix">
<div id="menu_block">-menu-
<div id="logo"> -logo-
<div id="container" class="clearfix">



 3:38 pm on Aug 13, 2013 (gmt 0)

Is that in your actual code, or just missing when reproducing it here?

 9:14 pm on Aug 13, 2013 (gmt 0)

Also: be very, very careful when using floats next to anything with a display set to something other than the default. Make sure there can never be an unwanted collision. You will probably need to switch off the float once you're below a certain size.


 11:52 pm on Aug 13, 2013 (gmt 0)

I don't see the problem. Which browser?


 7:08 am on Aug 14, 2013 (gmt 0)

I did check in my source if I had a typo in there. But it's just the example put here.

@lucy, i'll keep that in mind. I even read somewhere that float was completely unnecessary. I forgot what the alternative was tho.

@drhoward, (a lot of doctor here :))
it seem to be the #options which i had set to a fixed dimension.
after that the problem was solved

#options {
padding-bottom: 1.0em;
min-height: 80px;


 11:31 am on Aug 14, 2013 (gmt 0)

I even read somewhere that float was completely unnecessary.
You mean ever? It must have been a xkcd comic.
Global Options:
 top home search open messages active posts  

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved