Previous Message
Next Message

Explanation re: some odities

Sent by Schalk Neethling on 7 July 2005 21:09


Greetings All!

I am in the final stages of putting together a all CSS site and have now 
got IE to play nice and got the site to work on IE, Firefox Netscape 7.2 
and Opera but there are two things I needed to do to 'force' it to work. 
Please have a look at these two points and if you can give me some 
clarity on why I had to go this root or, show me a better way to do it, 
it will be much appreciated.

On the footer of the site, www.volume4.com/pattersonpruden/index.html, I 
have the following layout:
<div id="footer">
    <div id="footer-block-one"></div>
    <div id="footer-block-two"></div>
    <div id="footer-content">COPYRIGHT 2005 PATTERSON PRUDEN LLC - ALL 
RIGHTS RESERVED</div>
</div>

The first two divs are used to create the 'gradient' effect from dark to 
light gray and contains no images or text. The last DIV is the container 
for the actual text. The CSS that controls this area is:

#footer {
    background-color:#edecec;
    clear:both;
    padding:0;
    margin:0;
    width:778px;
    height:30px;
    overflow:hidden;
}
#footer-block-one {
    float:left;
    background-color:#999;
    margin:0;   
    width:100px;
    height:30px;
}
#footer-block-two {
    position:relative;
    left:100px;
    *left:-3px;
    background-color:#ccc;
    margin:0;   
    width:100px;
    height:30px;   
}
#footer-content {
    position:relative;
    top:-22px;
    left:200px;
    margin:0;
    width:575px;
    height:30px;
    text-align:right;
    font-size:9px;
}

Now the two things in question. First, to get the #footer-content DIV to 
be aligned as I wanted I had to go to using top:-22px;, otherwise it 
would fall below the other two DIV even when floated right. This was the 
same for both Firefox and IE. Now in IE when I use the top:-22px, as 
well as before using this, it adds a roughly 15px to the height of the 
footer. To eliminate this I had to add overflow:hidden to the #footer 
DIV. Any explanation, pointers, tips regarding these will be much 
appreciated. Thanks!

-- 
Kind Regards
Schalk Neethling
Web Developer.Designer.Programmer.President
Volume4.Business.Solution.Developers
emotionalize.conceptualize.visualize.realize
Landlines
Tel: +27125468436
Fax: +27125468436
Web
[EMAIL-REMOVED]
Global: www.volume4.com
Messenger
Yahoo!: v_olume4
AOL: v0lume4
MSN: [EMAIL-REMOVED]

We support OpenSource
Get Firefox!- The browser reloaded - http://www.mozilla.org/products/firefox/
 
This message contains information that is considered to be sensitive or confidential and may not be
forwarded or disclosed to any other party without the permission of the sender. If you received this
message in error, please notify me immediately so that I can correct and delete the original email.
Thank you.


______________________________________________________________________
css-discuss [EMAIL-REMOVED]]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Previous Message
Next Message

Possibly related: