MasterMax1313
New Member
- Messages
- 84
- Reaction score
- 0
- Points
- 0
I'm trying to make a site with what is in essence, a footer, in the main (center) div. So basically a div w/in a div. I've done this before and it works fine (in progress). However, in this new site, if I use width = 100%, it takes the width of the page, rather than the parent container. So I tried to change the width to the same percentage as the parent container (73%), but it's actually longer than the parent. Code is posted below. Any thoughts/anything I've missed? The site's location to see what it looks like (same in FF and IE) is here.
Thanks in advance.
Edit:
turns out that the problem was with padding on the right and left
Thanks in advance.
Code:
html, body
{
font-size:100%;
/* text-align:center;*/
height:100%;
margin-bottom:0;
margin-top:0;
padding-bottom:0;
padding-top:0;
background-color:#00134B;
}
.wrapper
{
height:100%;
width:100%;
}
.FirstCol
{
width:13.5%;
height:100%;
float:left;
}
.SecondCol
{
width:73%;
height:100%;
float:left;
background-color:#F1F1F1;
}
.ThirdCol
{
width:13.5%;
height:100%;
float:left;
}
.Footer
{
height:60px;
width:73%;
position:absolute;
bottom:0px;
background-color:#00B34B;/*00134B*/
}
.AboveFooter
{
height:25px;
width:73%;
position:absolute;
bottom:60px;
background-color:#333333;
}
HTML:
<body>
<div class="wrapper">
<div class="FirstCol">
</div>
<div class="SecondCol">
<div class="AboveFooter">
</div>
<div class="Footer">
<font class="Copyright">
Copyright <?echo date("Y");?>, UT Golden Key.
</font>
</div>
</div>
<div class="ThirdCol">
</div>
</div>
</body>
turns out that the problem was with padding on the right and left
Last edited: