How can I propperly arrange this?

Cesar Aracena
Cesar Aracena used Ask the Experts™
on
Hello everybody,

I'm quite rusty on CSS and I can't figure out how to propperly accomodate this. Everything I try scramble everything! Can somebody give me a headstart on this please?

It must be something that will start piling the boxes into the content area when the visitor uses smaller resolutions (i.e. show 2 boxes per row in 800 x 600 but 4 boxes in 1280 x 1024).

CSS layout
Thanks!
Comment
Watch Question

Do more with

Expert Office
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
Commented:
Have a look:
<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>hello</title>
<style type="text/css">
#wrap {width:100%;}
#sidebar {width:10%; min-height:600px; float:left; background:blue;}
#content {width:90%; overflow:hidden; float:left; background:green;}
.box {width:300px; height:300px; background:red; float:left; margin:5px;}
</style>
</head>
<body>

<div id="wrap" >
<div id="sidebar"> </div>
<div id="content">
<div class="box" ></div>
<div class="box" ></div>
<div class="box" ></div>
<div class="box" ></div>
<div class="box" ></div>
<div class="box" ></div>
</div>
</div>

</body>
</html>

Open in new window

Cesar AracenaPHP Enthusiast

Author

Commented:
Duh! This is CSS 101 hehe. Guess I need to get some sleep.

Thanks!

Do more with

Expert Office
Submit tech questions to Ask the Experts™ at any time to receive solutions, advice, and new ideas from leading industry professionals.

Start 7-Day Free Trial