Menu
Community /Pin to ProfileBookmark
@NogDogMay 16.2005 — #
My eyes aren't that good. I just ran it through the w3.org validators and it gave me a good idea where to look. ?@NogDogMay 16.2005 — #
I've avoided using absolute positioning so far, as it seems not worth the headaches, especially since I've been able to do whatever I need via floats, margins, padding, etc. (at least so far).
CSS doesn’t work!?!?!?!
ok, i was really excited to find out about css. but now i am really disappointed to find olut that nothing i create in goLive ever looks right in ANY browsers. what am i doing wrong? i have seen some pages that look great. but i have seen some examples on these forums that don’t appear proper either. can anyone let me in on the secret to making css work?
here is the page i am trying to create:
[url]www.afih.net/CSS.html
[B]here is the stylesheet:
body
{
background: #fff;
color: #000;
margin-left: 0px;
padding: 0;
}
ul
{
position: absolute;
top: 46px;
left: 0px;
float: left;
width: 100%;
padding: 0px;
margin: 0;
list-style-type: none;
}
a.menu
{
font-size: 15px;
text-align: center;
float: left;
width: 100px;
text-decoration: none;
color: white;
background-color: #999;
padding: 2px;
border-right: 1px solid #fff;
border-bottom: 1px solid #fff;
}
a.menu:hover {background-color: #c00}
li {display: inline}
a {font-family: Times}
a.main:link {color: #c00}
a.main:hover {color: #000}
a.main:visited {color: #069}
a.footer {text-decoration: none;}
a.footer:link {color: #900}
a.footer:hover {color: #f00}
a.footer:visited {color: #000}
H1
{
background-color: #fff;
width: 790px;
color: #f90;
font-size: 37px;
font-family: Arial;
border-bottom-width: 2px;
border-bottom-color: #c00;
border-bottom-style: solid;
/*position: absolute;
left: 0px;
top: 0px;
p.main {font-family: Courier}
div.left
{
/*position: absolute;
top: 68px;
font-family: Courier;
border-top: 1px solid #fff;
width: 200px;
height: 300px;
background-color: #999;
padding-left: 9px;
padding-top: 5px;
}
p.footer
{
font-size: 12px;
font-family: Times;
text-align: center;
position: absolute;
bottom: 0px;
}
[B]here is the html:
<!DOCTYPE html PUBLIC “-//W3C//DTD HTML 4.01 Transitional//EN”>
<html>
<head>
<meta http-equiv=”content-type” content=”text/html;charset=iso-8859-1″>
<meta name=”generator” content=”Adobe GoLive”>
<title>Forged WebDesign, LLC</title>
<link rel=”stylesheet” type=”text/css” href=”CSS_stylesheet.css”>
</head>
<body>
<h1>Forged WebDesigns, LLC</h1>
<div class=”menu”>
<ul>
<li><a class=”menu” href=”#”>Home</a></li>
<li><a class=”menu” href=”#”>Experiments</a></li>
<li><a class=”menu” href=”#”>Portfolio</a></li>
<li><a class=”menu” href=”#”>Referrences</a></li>
<li><a class=”menu” href=”#”>Contact Info</a></li>
<li><a class=”menu” href=”#”></a></li>
<li><a class=”menu” href=”#”></a></li>
</ul>
</div>
<div class=”left”>What happens now?</div>
<p></p>
<p></p>
<p></p>
<p><a class=”main” href=”http://www.afih.net”>Main page links</a></p>
<p>Regular Text.</p>
<p class=”footer”>
Copyright © 2005 Forged WebDesigns, LLC
<a class=”footer” href=”http://www.afih.net”>Contact Info</a>
</p>
</body>
</html>
Sign in
to post a comment8 Comments(s) ↴
0
@NogDogMay 16.2005 — #Good catch.[/QUOTE]
My eyes aren't that good. I just ran it through the w3.org validators and it gave me a good idea where to look. ?
0
@NogDogMay 16.2005 — #I think it's best to avoid absolute positioning, at least until you're really comfortable with how the flow goes without it.[/QUOTE]
I've avoided using absolute positioning so far, as it seems not worth the headaches, especially since I've been able to do whatever I need via floats, margins, padding, etc. (at least so far).