Forum Moderators: not2easy
body {
padding: 5px;
background: #B0C4DE;
}
p{
font-family : Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size : smaller;
}
}
#level0 {
background-color : #B0C4DE;
width:100%;
}
}
#level1{
margin-left:200px;
margin-right:30px;
padding-left: 10px;
padding-top: 10px;
padding-bottom:10px;
padding-right:10px;
background-color : #70C9DE;
border : dotted #20B2AA;
position:relative;
width:inherit;
}
#level3{
margin-top: 10px;
width:175px;
background-color : #4B0082;
border : dotted #20B2AA;
}
#level4{
padding-left: 2px;
padding-right: 2px;
padding-bottom: 2px;
padding-top: 2px;
background-color : #87CEEB;
}
#menu1{
background-color : #66CDAA;
}
Html:
<html>
<head>
<link rel="stylesheet" type="text/css"
href="style.css" />
</head>
<body>
<div id="level0">
<div id="level1">
<p>the webpage of jon buchan</p>
</div>
</div>
<div id="level3">
<div id="level4">
<p align="center">Menu System</p>
<div id="menu1">
<p>home</p>
<div id=
</div</div>
It works fine on my PC, but not on Mac Safari. I gave my friend some url's to CSS tutorials and all the examples worked fine for him, so whats wrong with my code?
Cheers
Jon
It happens in opera too.
Jon
border: 2px dotted #20b2aa.
Adam
The code (edited for easier debugging)
The html:
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>
<body>
<div id="level0">
<div id="level1">
<p>the webpage of jon buchan</p>
</div><!--end level1-->
</div><!--end level0-->
<div id="level3">
<div id="level4">
<p align="center">Menu System</p>
<div id="menu1">
<p>home</p>
<div id="unnamed"><!--id not named, no closing bracket-->
</div><!--end unnamed-->
</div><!--end menu1-->
</div><!--end level4--><!--div not closed-->
</div><!--end level3--><!--div not closed-->
The css file:
body {
padding: 5px;
background: #B0C4DE;
}p{
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: smaller;
}
/*
}
the bracket (commented out above) is the problem
*/
#level0 {
background-color: #B0C4DE;
width:100%;}
/*
}
the bracket (commented out above) is the problem
*/
#level1{
margin: auto 30px auto 200px;
background-color: #70C9DE;
border: 1px dotted #20B2AA;/* Give borders a value! */
position: relative;
width: inherit;
}
#level3{
margin-top: 10px;
width:175px;
background-color: #4B0082;
border : 1px dotted #20B2AA;
}
#level4{
padding: 2px;
background-color : #87CEEB;
}
#menu1{
background-color : #66CDAA;
}
hope this helps in the learning process!
ps sorry about the dodgy formatting above the css comments seem to close my code tag
jon
