Log In · Register

 
It's been a while since I've coded
LaRachel
post May 27 2009, 08:15 PM
Post #1


Senior Member
***

Group: Member
Posts: 75
Joined: Feb 2009
Member No: 717,000
Bear with me. I'm sure it's something silly...

CODE
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<head>
<title>Past to Present</title>
<style type="text/css">
body {
background:Url("http://i39.tinypic.com/23tl79x.png");
background-repeat: repeat;
font-size: 12px;
color:black;
text-align: center;
}


#image {
position:absolute;
left: 50%;
width: 850px;
margin-left:-425px;
}


#navigation {
position:absolute;
left: 50%;
width: 200px;
margin-left:-425px;
top: 425px;
text-align: center;
background-color: white;
float: left;
}


#content {
position:absolute;
top: 425px;
left: 69.5%;
margin-left:-425px;
align: center;
width: 650px;
text-alight: center;
background-color: white;
float: right;
}

a, a:link, a:visited {
font-size:14;
font-color:#9DBAB6;
}

a:hover {
font-size:14;
font-color:#75C7A7;
}

b, strong {
color: #D6E59F;
}


i {
color: #F386A6;
}


s {
color: #D788BF;
}


u {
color: #FFF4A1;
}


h1 {
color:#70CBF3;
font-size: 16px;
letter-spacing:0px;
font-family: arial;
text-transform: uppercase;
}

a:link, a:visited, a:active
{font: 16px arial;
color: #D88DC2;
font-weight:normal;
text-decoration: none;
border-bottom: 1px dashed #D88DC2;
}

a:hover
{font: 16px arial;
color: #FFF39C;
font-weight:normal;
text-decoration: none;
border-bottom: 1px dashed #FFF39C;
}



</style>
</head>
<body>
<div id="image">
<img src="http://i40.tinypic.com/ruct8g.png">

</div>


<div id="navigation"><p>
Hello, this is where all of the links will go. Toodles.
</p></div>

<div id="content"><p>
this is really effing scary.
</p></div>

</div>
</body>
</html>


So, two problems. The first one is that my content div is doing wacky things in different resolutions, as well as in different browsers. It's only lined up properly in firefox with a 1024x762 resolution, and I literally have no idea how to fix it.

Also, I don't have a set height on my content and navigation divs, but is there a way for them to end at the same place? I'm using this for a blog, so the content div will be much taller than the navigation. Is there a way to make the navigation just as long as the content without having a set height?
 
 
 Start new topic
Replies (1 - 3)
schizo
post May 27 2009, 10:37 PM
Post #2


Senior Member
******

Group: Staff Alumni
Posts: 2,435
Joined: Feb 2007
Member No: 506,205
For your content area, keep it at left:50% and change the margin-left:#px only. Also, it doesn't look like you need floats here. You could probably get rid of those completely.
 
LaRachel
post May 28 2009, 08:46 AM
Post #3


Senior Member
***

Group: Member
Posts: 75
Joined: Feb 2009
Member No: 717,000
Thanks happy.gif
 
manny-the-dino
post May 28 2009, 05:01 PM
Post #4


Senior Member
*******

Group: Administrator
Posts: 8,629
Joined: Jan 2007
Member No: 498,468
Topic Closed & Moved
 
« Next Oldest · Webmasters' Corner Resolved Topics · Next Newest »
 

Closed TopicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 

Display Mode: Switch to: Standard · Linear+ · Switch to: Outline

Track this topic · Email this topic · Print this topic