Forum : css code check
Brief description  about Online courses   join in Online courses
View Thangam  Nayagi 's Profile

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>
Asked by Thangam Nayagi | Feb 2, 2011 |  Reply now
Replies (2)
View thangam nayagi 's Profile
works fine, thabnks
Feb 2, 2011
View teacher siliconindia 's Profile
Hi

try this 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{
width:500px; float:left;
background-color:#5CB3FF;
}

#rightmenu{ margin-left:510px;
width:170px;


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">




<!--left part start-->
<div id="centerwork">
<span 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>
<!--left part close-->

<!--right part start-->

<div id="rightmenu">
<span class="stylem"> CSS Basics </span> </div>


<!--right part close-->




</div>



</div>
</body>

Regards
Feb 2, 2011