|
mtfm -> question re: margin around the page (5/22/2006 13:52:36)
|
Hello!
I don't post much, mainly because I am still learning and don't know what to ask. That, and the search function is of course quite helpful! [sm=s26.gif]
Anyway, I am charged with writing a manual at my company and posting it on the web. It is on the intraweb and behind a firewall, so I can't post the link. I am not really a computer person but over the last 6 months or so have taught myself HTML, a smattering of Javascript, and am in the process of teaching myself CSS. I am teaching MYSELF because everyone else is still using FRAMES for everything, the only Javascript is whatever Frontpage 2003 inserts, and there is no CSS to be found.
Anyway, for CSS, I have created a template which works really nicely--- EXCEPT that I have a white space all the way around the page. I am thinking this is the "IE box hack" I keep hearing about, can someone confirm this for me?
(By the way, I have it kind of easy, ALL browsers which will ever look at this page are IE 6.x--- so I know if it works for me, it works for everyone--- BUT if it DOESN'T work for me, I am always left wondering if it is my fault or IE's. (Usually it's mine but I like having a scapegoat anyway!) [sm=whistling.gif])
Anyway, here's my CSS-- anyone see anything obviously wrong?
Thank you in advance to the forum gods! [sm=bowdown.gif]
EXTERNAL STYLE SHEET:
body
{
font-family: arial, serif
background-color:#D40511;
margin:0px;
padding: 0px;
}
div.container
{
height:95%;
background-color: #ffcc00;
width:100%;
margin:0px;
padding: 0px;
}
div.header
{
width:100%;
height:15px;
background-color:#D40511;
background-image: url("../../test%20folder/horizontal_gradient_yellow_on_top.png");
padding:0.8em;
font-size: 150%;
color:Black;
font: bold 100%;
text-align: center;
background-image: url("../../test%20folder/yr.gif");
background-repeat: no-repeat;
background-position: left;
clear:left;
}
div.dropdown
{
height:40px;
width:100%;
background-color:#FFCC00;
background-image: url("../../test%20folder/gradient.jpeg");
background-repeat: repeat-x;
clear:left;
}
div.left
{
height:60%;
Width:80px;
float:left;
margin:0px;
padding:.3em;
background-color:#FFCC00;
clear:bottom;
overflow:hidden;
)
div.buttonscontainer {
width: 60px;
}
div.buttons a {border-left:1px solid #d40511; border-right:1px solid #ffcc00; border-top:1px solid #d40511; border-bottom:1px solid #d40511; color: #d40511;
background-color: #ffcc00;
padding-left: 3px;
font-weight: bold;
text-decoration: none;
display: block;
margin: 0px;
width: 100%;
text-align: left; font-style:normal; font-variant:normal; font-size:11px; font-family:Arial, sans-serif; padding-right:2px; padding-top:2px; padding-bottom:2px
overflow:hidden;
}
div.buttons
a:hover {border-left:1px solid 0000000; border-right:1px solid #ffc000; border-top:1px solid 0000000; border-bottom:1px solid #ffc000; padding-left: 4px;
padding-top: 3px;
padding-bottom: 1px;
padding-right: 1px;
background-color: #ffc000;
color: 0000000;
text-decoration: none
overflow:hidden;
}
div.content
{
position:relative;
height:70%;
margin-left:75px;
padding:none;
background-color: #ffffff;
overflow:scroll;
}
div.footer
{
height:15px;
background-color:#FFCC00;
text-align: center;
font-size: 80%
}
THE PAGE ITSELF:
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Title of Page here</title>
<LINK rel="Test stylesheet" type="text/css" name="stylesheet1" href../../test%20folder/stylesheet1.css">
<script language="javascript" src=../../test%20folder/chainedmenu.js">
/***********************************************
* Chained Selects script- By Xin Yang (http://www.yxscripts.com/)
* Script featured on/available at http://www.dynamicdrive.com/
* Visit Dynamic Drive at http://www.dynamicdrive.com/ for full source code
***********************************************/
</script>
<script language="javascript" src="test%20folder/config.js"></script>
<link rel="shortcut icon" href="favicon.ico" />
</head>
<body onload="initListGroup('chainedmenu', document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel, 'savestate')">
<div class="container">
<div class="header">
<h2>Claims Department</h2>
</div class="header">
<div class="dropdown">
<form name="listmenu0">
<p align="center"> <select name="firstlevel" style="width:180;height:20"></select>
<select name="secondlevel" style="width:160px;"></select>
<select name="thirdlevel" style="width:160px;"></select>
<input type="button" value="Go" onclick="goListGroup(document.listmenu0.firstlevel, document.listmenu0.secondlevel, document.listmenu0.thirdlevel)">
</p>
</form>
<p><font color="#000000" size="4" face="Arial">You are here:</font><font size="3"><font color="#000000" size="1" face="arial"> <script language="javascript" src="../../CargoClaims/intraweb/js_files_and_site_pieces/breadnav.js">
</script> -><br>
</font></font><font face="arial">T</font><font color="#000000" size="3" face="arial">his page was last updated
<!--webbot bot="Timestamp" S-Type="EDITED" S-Format="%m/%d/%y %H:%M" --></font></p>
</div class="dropdown">
<div class="left">
<div class="buttonscontainer">
<div class="buttons">
<a href="http://link home/">HOME</a><br>
<a href="link to index">Index</a>
<a href="link to systems">System Issues</a>
<a href="Link to screens">Screens</a>
<a href="link to more screens">more Screens</a>
<a href="link to file locations">File Locations</a>
</div class="buttons">
</div class="buttonscontainer">
</div class="left">
<div class="content">
</div class="content">
</div class="container">
<div class="footer">
<a href="mailto:(email censored for posting--no spam for me, thanks)?subject=Webite Feedback">
<img border="0" src="images/buttons_and_misc_pics/feedback3.gif" width="80" height="15"></a>
</div class="footer">
</body>
</html>
|
|
|
|
