shelly121
16-02-2005, 09:08
can any1 help-nt very gud at xhtml bt have 2 do it 4 a uni assignment. i have tryd to create a "print stylesheet" so that when the user prints the page it doesnt show all the colors etc, and i wanted it so that the writing is after the buttons only WHEN PRINTED. i now know its to do with havin the wrong IDs on the stylesheet but tryed changin them to correspond with the homepage but it stil dont work!!!:
body {
background: white;
font-size: 12pt;
}
#nav1 #navbar {
display: top;
}
div#class {
width: auto;
margin: 0 5%;
padding: 0;
border: 0;
float: none !important;
color: black;
background: transparent none;
}
div#navbar {
margin-left: 10%;
}
a:link, a:visited {
color: #520;
background: transparent;
font-weight: bold;
text-decoration: underline;
}
#content a:link:after, #content a:visited:after {
content: " (" attr(href) ") ";
font-size: 90%;
}
and heres my actual xhtml for tthe homepage-i have deleted stuff in the paragraphs incase ur wondering y they only have "...."!!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>My Homepage</title>
<link rel="stylesheet" href="teststyle.css" />
<link rel="stylesheet"
type="text/css"
media="print" href="print.css" />
</head>
<body>
<div class="head"><h1>.....</h1></div>
<div class="nav1">
<ul>
<li><a href="http://validator.w3.org/check?uri=referer"><img
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0!" height="31" width="88" /></a></li>
<li><a href="http://jigsaw.w3.org/css-validator/validator"><img src="CSS.bmp" alt="css validated!" /></a></li>
</ul></div>
<div class="navbar"><br /><br /><br /><br /><br />
<ul>
<li><a href="About Me.htm" accesskey="a"> <em>A</em>bout Me!</a></li>
<li><a href="MyTown.htm" accesskey="m"> <em>M</em>y Town </a></li>
<li><a href="pets.htm" accesskey="p"> My <em>P</em>et</a></li>
<li><a href="form.htm" accesskey="c"> <em>C</em>ontact Me</a></li>
</ul>
</div>
<!-- Main content -->
<div class="main">
<p>Welcome to my Homepage</p>
<p>.... </p>
<p>...</p>
<br /><br /><br />
<center><img id="plant" src="plant.jpg" alt="plant" width="150" height="105"border="3" /></center>
<br /><br />
<hr />
<center>
<address></address>
<address> England.</address></center><br /><br /><br /></div>
<div id="navcontainer2">
<ul>
<li><a href="form.htm" accesskey="c"><em>C</em>ontact Me</a></li>
<li><a href="About Me.htm" accesskey="a"> <em>A</em>bout Me!</a></li>
<li><a href="MyTown.htm" accesskey="m"> <em>M</em>y Town </a></li>
</ul>
</div>
</body>
</html>
body {
background: white;
font-size: 12pt;
}
#nav1 #navbar {
display: top;
}
div#class {
width: auto;
margin: 0 5%;
padding: 0;
border: 0;
float: none !important;
color: black;
background: transparent none;
}
div#navbar {
margin-left: 10%;
}
a:link, a:visited {
color: #520;
background: transparent;
font-weight: bold;
text-decoration: underline;
}
#content a:link:after, #content a:visited:after {
content: " (" attr(href) ") ";
font-size: 90%;
}
and heres my actual xhtml for tthe homepage-i have deleted stuff in the paragraphs incase ur wondering y they only have "...."!!
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />
<title>My Homepage</title>
<link rel="stylesheet" href="teststyle.css" />
<link rel="stylesheet"
type="text/css"
media="print" href="print.css" />
</head>
<body>
<div class="head"><h1>.....</h1></div>
<div class="nav1">
<ul>
<li><a href="http://validator.w3.org/check?uri=referer"><img
src="http://www.w3.org/Icons/valid-xhtml10"
alt="Valid XHTML 1.0!" height="31" width="88" /></a></li>
<li><a href="http://jigsaw.w3.org/css-validator/validator"><img src="CSS.bmp" alt="css validated!" /></a></li>
</ul></div>
<div class="navbar"><br /><br /><br /><br /><br />
<ul>
<li><a href="About Me.htm" accesskey="a"> <em>A</em>bout Me!</a></li>
<li><a href="MyTown.htm" accesskey="m"> <em>M</em>y Town </a></li>
<li><a href="pets.htm" accesskey="p"> My <em>P</em>et</a></li>
<li><a href="form.htm" accesskey="c"> <em>C</em>ontact Me</a></li>
</ul>
</div>
<!-- Main content -->
<div class="main">
<p>Welcome to my Homepage</p>
<p>.... </p>
<p>...</p>
<br /><br /><br />
<center><img id="plant" src="plant.jpg" alt="plant" width="150" height="105"border="3" /></center>
<br /><br />
<hr />
<center>
<address></address>
<address> England.</address></center><br /><br /><br /></div>
<div id="navcontainer2">
<ul>
<li><a href="form.htm" accesskey="c"><em>C</em>ontact Me</a></li>
<li><a href="About Me.htm" accesskey="a"> <em>A</em>bout Me!</a></li>
<li><a href="MyTown.htm" accesskey="m"> <em>M</em>y Town </a></li>
</ul>
</div>
</body>
</html>