James,

I imagine the footer image is hiding behind some of your other images try
putting 

border : 500px; 
border-color : #f00;

in the footer id definition to see where it went to. Try taking out 
float: left;
from the id definition to see if that is messing with things.

HTH

John.

-----Original Message-----
From: James Cutts [mailto:[EMAIL PROTECTED] 
Sent: 01 June 2006 14:22
To: [email protected]
Subject: [wdvltalk] css float positioning problem

Hi, I'm new to the list although I used to lurk on here a few years ago

I've got a problem with a CSS layout.

It works fine in Safari and Firefox, but in IE the footer (#footer)  
completely disappears.

Im also having problems lining up the menu and content on different  
browsers - does anyone have a solution?

You can view the page here:

http://www.deepdesign.biz/deepdesign2/index2.html

I've pasted the relevant code below in case anyone can see anything  
obvious.

Thanks in advance - I've tried so many combinations of float,  
absolute and relative positioning I've run out of ideas.

J

<!-- html -->

<body>

<div id="page">

<div id="logo">
<img src="images/logo.gif" alt="Logo" />
</div>

        <div id="top">
        </div>

                <div id="main">
                <div id="rightcolumn">
                
                <ul id="nav">
                <li><a href="index.html">welcome</a></li>
                <li><a href="porfolio.html">portfolio</a></li>
                <li><a href="websites.html">websites</a></li>
                <li><a href="blogs.html">blogs</a></li>
                <li><a href="branding.html">branding</a></li>
                <li><a href="print.html">print</a></li>
                <li><a href="contact.html">contact</a></li>
                </ul>
                </div>
                
                <div id="content">
                        
                        <h1 id="pageheader">welcome to deep design</h1>
                        
                                <p id="intro">Document-centric projections
unfetter traditional  
auditing practices <a href="portfolio.html"> rivaling central</a>  
process management. Advanced functionality, easy administration,  
proclaim the hallmarks of unprecedented opportunity. Iteration  
systemwide engenders economies of scale, cross-media technology,  
presentation action items and life cycle replication</p>
                
                        
                        <dl id="portfolio">
                        
                
                        <dt>
                        <h2>colour inspiration</h2>
                        
                        <div id="images">
                        <div id="image1"></div>
                                
                        <div id="image2"></div>
                                
                        <div id="image3"></div>
                        </div>
                  <dd>
<p>Conceptualizing random endpoints in a access matrix provides reach  
extentions enterprise wide. Respective divisions historically  
insignificant, upscale trendlines in a management inventory analysis  
survivabilty format.</p>

<p>Document-centric projections unfetter traditional auditing  
practices rivaling central process management. Advanced  
functionality, easy administration, proclaim the hallmarks of  
unprecedented opportunity.
Iteration systemwide engenders economies of scale, cross-media  
technology, presentation action items and life cycle replication.</p>
                  </dd>
                        </dt>
                          <dt>
                        <h2>a deep design</h2>
                          <dd>
<p>Conceptualizing random endpoints in a access matrix provides reach  
extentions enterprise wide. Respective divisions historically  
insignificant, upscale trendlines in a management inventory analysis  
survivabilty format.</p>

<div id="images">
                        <div id="image4"></div>
                                
                        <div id="image5"></div>
                                
                        <div id="image6"></div>
                        </div>

<p>Document-centric projections unfetter traditional auditing  
practices rivaling central process management. Advanced  
functionality, easy administration, proclaim the hallmarks of  
unprecedented opportunity.
Iteration systemwide engenders economies of scale, cross-media  
technology, presentation action items and life cycle replication.</p>
                          </dd>

                                        </dt>
                  </dl>
                </div>
                <!-- content closing tag -->
                
                <div id="footer"></div> 
                
                
   </div> <!-- main closing tag -->
                
                
        

</div> <!-- page closing tag -->



</body>




<!-- css -->

body {
        margin-left: 0px;
        margin-top: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
}

#page {
        width: 770px;
        height: 100%;
}

#logo {
position: absolute;
left: -600px;
}

#top {
float: left;
width: 770px;
height: 421px;
background: url(images/deeptop.jpg);
}

#main {
float: left;
position: absolute;
top: 421px;
left: 0px;
width: 770px;
background: url(images/deepbgtile.jpg);
}

#rightcolumn {
float: right;
position: absolute;
top: -50px;
left: 550px;
width: 80px;
}

#nav {
list-style: none;
font-family: "Helvetica Neue", Verdana, sans-serif;
font-size: 30px;
line-height: 32px;
font-weight: bold;
color: #CCCCCC;
letter-spacing: -1px;
}


#content {
float: left;
position: relative;
top: -80px;
width: 350px;
margin-left: 140px;
}

#content dl {
margin-left: 0px;
position: relative;
top: 10px;
}

#content dt {
height: 30px;
border-bottom: solid 1px #CCCCCC;
}

#content dd {
margin-left: 0px;
font-family: "Helvetica Neue", Verdana, sans-serif;
color: #666666;
font-size: 12px;
line-height: 17px;
}

#footer {
clear: both;
float: left;
width: 770px;
height: 125px;
background: url(images/bottom.jpg);
background-repeat: no-repeat;
}

--------------------------
James Cutts
Deep Design
Mobile 07941 208097
Office 0208 6709031
e: [EMAIL PROTECTED]
w: http://www.deepdesign.biz


____  The WDVL Discussion List from WDVL.COM  ____
To Join wdvltalk, Send An Email To:
mailto:[EMAIL PROTECTED] or
use the web interface
http://e-newsletters.internet.com/discussionlists.html/
       Send Your Posts To: [email protected]
To change subscription settings, add a password or view the web interface:
http://intm-dl.sparklist.com/read/?forum=wdvltalk

________________  http://www.wdvl.com  _______________________

You are currently subscribed to wdvltalk as: [EMAIL PROTECTED]
To unsubscribe send a blank email to [EMAIL PROTECTED]
To unsubscribe via postal mail, please contact us at:
Jupitermedia Corp.
Attn: Discussion List Management
475 Park Avenue South
New York, NY 10016

Please include the email address which you have been contacted with.


____ • The WDVL Discussion List from WDVL.COM • ____
To Join wdvltalk, Send An Email To: mailto:[EMAIL PROTECTED] or
use the web interface http://e-newsletters.internet.com/discussionlists.html/
       Send Your Posts To: [email protected]
To change subscription settings, add a password or view the web interface:
http://intm-dl.sparklist.com/read/?forum=wdvltalk

________________  http://www.wdvl.com  _______________________

You are currently subscribed to wdvltalk as: unknown lmsubst tag argument: ''
To unsubscribe send a blank email to [EMAIL PROTECTED]
To unsubscribe via postal mail, please contact us at:
Jupitermedia Corp.
Attn: Discussion List Management
475 Park Avenue South
New York, NY 10016

Please include the email address which you have been contacted with.

Reply via email to