If I set the <div> properties nothing seems to work. But if I set properties in the h1.navigation, the border and backcolor show up.
The following html code is within the <body> tag:
This doesn't show a border or backcolor, nor can I position it anywhere.
<div class="navigation_page"> hi </div>
This shows backcolor and border:
<div class="navigation_page"> <h1 class="navigation">hi</h1> </div>
here's the css:
/* ---- Body ---- */
body {
margin:0 auto;
width:800px;
font-family: 'Palatino Linotype', 'Book Antiqua', Palatino, serif;
background-color:silver;
}
/* ---- Header ---- */
.header ul, li {
display:inline;
}
div.header{
width:100%;
text-decoration:none;
background-color:#000070;
color:white;
margin:0 auto;
width:100%;
border:2px solid #000070;
}
img.logo{
float:left;
}
img.headerleft1{
left: 0%;
position: relative;
}
img.headerleft2{
left:7%;
position: relative;
}
img.headerleft3{
left:12%;
position: relative;
}
img.headerleft4{
left:17%;
position: relative;
}
h1.header{
font-size:250%;
color:white;
text-align:center;
font-weight:bold;
}
/* ---- Content ---- */
div.content{
width:100%;
border:2px solid #000070;
margin-top:2em;
margin-bottom:2em;
background-color:white;
padding:1em;
}
/* ---- Left Sidebar ---- */
div.left{
}
td{
width:33%;
text-align:center;
}
/* ---- Navigation ---- */
div.navigation{
background-color:grey;
text-align:center;
width:100%;
margin-top:0;
margin-bottom:0;
text-decoration:none;
color:white;
font-size:16pt;
font-weight:bold;
}
/*
h1.navigation_title{
position:relative;
left:-15%;
width:26%;
font-size:24pt;
font-weight:bold;
color:white;
float:left;
border:2px solid black;
background-color:grey;
padding :3px;
}*/
}
div.navigation_page{
background-color:white;
width:100%;
margin-top:3px;
margin-bottom:0;
text-decoration:none;
color:white;
font-size:6pt;
border:2px solid #000070;
}
table.navigation{
width:100%;
}
td.navigation{
width:33%;
text-align:center;
}
/* ---- Top ----*/
a.top{
float:left;
font-size:12pt;
}
/* ---- Pseudoclasses ---- */
a:link{
text-decoration:none;
color:white;
}
a:visited{
text-decoration:none;
color:white;
}
a:hover{
color:#000070;
}
I'm new to web developing so please feel free to comment on anything..
Thanks in advance

New Topic/Question
Reply


MultiQuote




|