Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations Mike Lewis on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

CSS question

Status
Not open for further replies.

webslinga

Programmer
Jun 20, 2006
55
US
Hello all,
I am having a problem with a CSS layout. I would like to have a webpage with a banner, top navigational links, a left column and a right column. I need those two content encapsulated within a div tag called main. The only problem is I cannot get them to both sit nicely in that main box. Please have a look:
[css]
ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,body,html,p,blockquote,fieldset,input
{ margin: 0; padding: 0; }

a img,:link img,:visited img { border: none; }

a
{ text-decoration: none; }

a:hover
{ text-decoration: underline; }

body
{
border: 1px solid black;
margin: 30px;
background-color: #e7e78e;
}

td
{
margin: 30px;
padding: 0px;
font-family: Arial, Verdana, sans-serif;
font-size: 11px;
background-color: #fff;
}

/***************************************************/
/******************CSS Classes**********************/
.header
{
margin: 5px;
border: 1px solid black;
height: 100px;
}

.footer
{

}

.main
{
border: 1px solid black;
margin: 5px;
}

.welcome
{
float: left;
border: 1px solid black;
margin: 5px;
width: 75%;
background-color: #e78a27;
}

.whats_new
{
float: left;
border: 1px solid black;
margin: 5px;
width: 23%;
}

.top_menu
{
border: 1px solid black;
margin: 5px;
padding: 5px;
background-color: #ba7428;
}


#links
{
border: 1px solid black;
margin: 5px;
padding: 5px;
}

.backdrop
{
background-color: #e4e426;
}

HTML:
<div class="header">This is where the banner should go</div>

<div class="top_menu">Professional | Bio | Weblog | Projects</div>
<div class="main">
<div class="welcome"><?php echo 'Content goes in here'; ?></div>
<div class="whats_new">This is what's new</div>
</div>

Please let me know what I am doing wrong
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top