Below is my code for a simple layout I have, but I can't seem to get It just how I want it.
The div #img_logo is going to be a small image button about the size I have there now, but I can't get it to go to the right side of the top div box. It is pushed below it. I want it about 30px or so to the right of the top div box.
Any suggestions would be greatly appreciated.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#layout, #top, #content { overflow: hidden; min-height: 1px; }
#layout { width: 912px; margin: 0 auto; }
#layout #top { width: 737px; height: 275px; float: left; display: block; margin-left: 83px; margin-bottom: 25px; padding: 0; border: 1px solid #0b5d8d; }
#layout #img_logo { width: 175px; height: 60px; background: #000; float: right; display: block; margin: 0; padding: 0; }
#content { float: none; clear: both; margin: 0 50px; padding: 0; }
#content #left { float: left; display: block; margin: 0 30px; padding: 0; border: 1px solid #0b5d8d; width: 357px; height: 378px; }
#content #right { float: left; display: block; margin: 0; padding: 0; border: 1px solid #0b5d8d; width: 357px; height: 378px; }
</style>
</head>
<body>
<div id="layout">
<div id="top"></div>
<div id="img_logo"></div>
<div id="content">
<div id="left"></div>
<div id="right"></div>
</div>
</div>
</body>
</html>
|