does anyone have a clue what i did wrong or is there a way to stop their from happening
header html code
<body style="background-color:#CCC">
<div id="header">
<div id="header_logo">
<!-- start of the tier 1 division -->
<div class="tier1">
KEVIN
</div>
<!-- start of the tier 2 division -->
<div class="tier2">
SNOWDON
</div>
<!-- start of tier 3 division -->
<div class="tier3">
Building Services
</div>
<!-- start of tier 4 division -->
<div class="tier4">
<p><img class="header_logo_phone" src="images/header_right_phone.png" width="35" height="43" alt="Phone Now on 07710761766" />07710761766</p>
</div>
</div>
<div id="main_montage"><img src="images/main_motage.jpg" width="851" height="123" /></div>
</div>
css code for main and header
@charset "UTF-8";
/* CSS Document */
#main_content{
margin-right:auto;
margin-left:auto;
width:1051px;
}#left{
width:50%;
float:left;
background-color:#999;
}#right{
width:50%;
float:right;
background-color:#999;
}#right_container{
width:96%;
float:right;
margin-left:10px;
}#main_img_desc{
border: #000 thin;
height: 200px;
margin-top:10px;
border: thin solid #666;
}#header{
width:95%;
margin-right:auto;
margin-left:auto;
height:123px;
max-width:1051px;
}.title_bar{
height:30px;
width:100%;
background-image: url(../images/smooth_button.jpg);
background-repeat: repeat-x;
}#contact{
margin-top:10px;
border: thin solid #666;
}
@charset "UTF-8";
/* CSS Document */
#header_logo{
height:123px;
width:200px;
float:left;
overflow:hidden;
}#header_logo .tier1{
width:100%;
height:25%;
text-align:center;
font-size:32px;
}
#header_logo .tier2{
width:100%;
height:25%;
text-align:center;
font-size:32px;
}
#header_logo .tier3{
width:100%;
height:10%;
text-align:center;
font-size:18px;
}#header_logo .tier4{
width:100%;
height:40%;
text-align:left;
font-size:24px;
}
img.header_logo_phone
{
vertical-align:middle;
float:left;
margin-top:auto;
margin-bottom:auto;
}
#main_montage {
}


any feedback is appreciated
Thanks dale

New Topic/Question
Reply


MultiQuote



|