Hello guys, newbie to the boards and newbie to css.
I have a footer with repeating background image in the footer and I have set up 3 columns in my css and html. the text shows up on top of my footer background image but the footer columns are stacked on top of each other instead of inline. I have search google and message boards all day long (literally thats all i have done all day long lol). I have tried a few things I saw but still no solution. Strange that my columns in the body work fine but not the footer. Hopefully you guys can help me get these aligned.
How it looks now:
http://img266.imageshack.us/img266/6…01004at552.png
How it should look:
http://img69.imageshack.us/img69/1145/footerex.jpg
My css: which is probably terrifying to most of you because i’m new to this. I probably have extra stuff in there i don’t need now because i have been trying things.
#clearfooter {
min-height: 100%;
width: 900px;
margin:0 auto; /* centers #wrapper */
}
#footer {
background: url(../Images/footerbg.png) repeat-x left;
background-color: ;
height: 164px;
width:100%; /* centered div must be given a width */
margin:-80px auto 0; /* -80px sucks it back in & auto centers it */
font-family: Arial, Helvetica, sans-serif;
font-size: 10px;
color: #B4A198;
padding-bottom: 0px;
}
#footercontainer {
float: left;
min-height: 100%;
width: 1007px;
}
#left{
height: 100%;
width: 124px;
float: left;
padding-right: 20px;
text-align:left;
display:inline;
}
#right{
height: 100%;
width: 124px;
float: right;
padding-right: 20px;
text-align:right;
display:inline;
}
#centered{
height: 100%;
width: 124px;
float: center;
padding-right: 20px;
text-align:center;
display:inline;
}
MY HTML:
</div><!-- end #container -->
<div id="clearfooter">
<p> </p>
</div>
</div><!-- end #wrapper -->
<div id="footer">
<div class="footercontainer">
<div class="left">Left aligned text here<br />Next line here</div>
<div class="right">Right aligned text here<br />Next line here</div>
<div class="centered">Center Text here<br />Next line here</div>
</div>
</div>
thanks for the help in advance guys!