luca
luca

Reputation: 37136

prevent div moving on window resize

I have a page with two divs "list_events" and "right_content" one next to each other. When I resize the window "right_content" moves down "list_events" but i dont want that! I dont want those two divs to move neither to scale down on window resizement..how can I achieve that?

this is the code

.list_events{margin-left:1em;float:left;}
.right_content{float:left;margin-left:1em;}

thanks Luca

Upvotes: 14

Views: 47455

Answers (2)

somdow
somdow

Reputation: 6318

first add a parent div/wrap and put those two divs of yours into it.

like so:

<div id="wrap">
   <div id="list_events"></div>
    <div id="right_content"></div>

</div>

then you can try the

min-width(px/ems/ etc) on the parent/wrapper div like so:

#wrap{
min-width: 600px;
}

Overall, whatever size you add to the min-width itll scale the parent div down to the size specified.

once the window is sized down past your specified size, itll behave like any other window.

this is my way of doing it.

Upvotes: 16

Mohammad
Mohammad

Reputation: 111

You can put this divs inside parent div with fixed width/height for that div, or you can determine a percentage width/height for each two divs.

Upvotes: 0

Related Questions