css code check
hi sir,
i designed a page and i wanted two chunks of data adjacent to each other i.e the #centerwork and #right menu to be adjacent to each other, but some how the rightmenu came below
to the left of the centerwork area, i tried rectifying the code but couldn't....can you please help me in identifying what went wrong in this code.
here is the code
<html>
<head>
<title>Rock2B Solutions
</title>
<style type="text/css">
body{
padding:0;
margin:0;
background:#fff;
}
#maincntr{
margin-left:160px;
margin-right:160px;
align:center;
border-right: 1px solid #AFC7C7;
border-left: 1px solid #AFC7C7;
background: #fff;
height: 100%;
}
#mainworkarea{
width:100%;
background-image:url('images/linebg.jpg');
}
#centerwork{
height:30px;
width:700px;
float:left;
background-color:#5CB3FF;
margin:15px;
padding:10px 10px 10px 15px;
}
#rightmenu{
float:right;
width:170px;
margin-top: 50px;
margin-right: 10px;
padding-right:10px;
}
#rightmenu li{
font: normal 14px "Trebuchet MS", Arial, Helvetica, sans-serif;
text-align:left;
color:#800080;
padding-left:0px;
}
</style>
</head>
<body>
<div id="maincntr">
<div id="mainworkarea">
<span id="centerwork" class="stylep1"><img src="images/welcomebox.jpg" alt=" About Us " width="180" height="180" align="right" /><strong>Focus area:</strong> <br/><br/>
<strong>IT Systems:</strong> Build and manage effectively IT systems used by billions of people each day. Always up and secure.<br/><br/>
<strong>Home Entertainment:</strong> Consumer networking and connectivity solutions to deliver digital contents (High Definition) to home. <br/><br/>
<strong>Home/Office Automation:</strong> Installation and support for media, gaming, lighting, security, telecom and climate control systems.
</span></div>
<div id="rightmenu">
<span class="stylem"> CSS Basics</div>
</span>
</div>
</body>