How do I get text to stay in relation to the page

**drhowarddrfine** · Aug 15 '08, 10:42 PM

It is easy but the fix depends on how you wrote it so we need to see the markup.

**Brendaw** · Aug 15 '08, 10:50 PM

This is my css/html for the page. I am new at this and am still learning so if you can explain what I need to do that would be very helpful. If I am doing it all wrong please let me know. Thanks

Code:

@charset "UTF-8";
#Blog {
	position: absolute;
	top: 59%;
	right: 58%; z-index:2; font:Georgia, "Times New Roman", Times, serif;
	font-size: 21px;
}
#BG {z-index: 1;}
#Classes {
	position: absolute;
	top: 68%;
	right: 52%;
	z-index:2;
	font-size: 22px;
}
#Gallery {
	position: absolute;
	top: 59%;
	right: 39%;
	z-index:2;
	height: 35px;
	font-size: 22px;
}
#AboutUs {
	position: absolute;
	top:68%;
	right: 34%;
	z-index:2;
	height: 35px;
	font-size: 22px;
}

#Mail {
	position: absolute;
	top: 76%;
	right: 40%;
	z-index:2;
	height: 35px;
	font-size: 22px;
}
#.width {width:100%; min-width:600px;}
#.height {height:100%; min-width:532px;}

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<link href="website templates/untitled.css" rel="stylesheet" type="text/css" />
<style type="text/css">
<!--
body {
}
-->
</style></head>

<body>
<div id="BG"><img src="website templates/background.jpg" width="100%" height="100%"/>
  <div id="Blog"><a href=""><img src="website templates/flowerlink.gif">Blog</a></div>
<div id="Classes"><img src="website templates/flowerlink.gif">Classes/Calendar</div>
<div id="Gallery"><img src="website templates/flowerlink.gif">Photo Gallery</div>
<div id="AboutUs"><img src="website templates/flowerlink.gif">About Us</div>
<div id="Mail"><img src="website templates/flowerlink.gif">Join Our Mailing List</div>
 
</div>
</body>

</html>

**David Laakso** · Aug 17 '08, 10:08 PM

You'll have far better luck if you structure the page using floats rather than absolute positioning. Start with a layout that is known to be stable, robust, and cross-browser reliable. Here are some [1].

Code to compliant browsers-- Opera, Safari, Firefox. Make frequent check-backs to IE/6 and IE/7.

[1]

Pagina non Trovata | HTML.it

http://blog.html.it/layoutgala/

How do I get text to stay in relation to the page

How do I get text to stay in relation to the page

Comment

Comment

Comment