SitePoint Sponsor

User Tag List

Page 2 of 2 FirstFirst 12
Results 26 to 37 of 37
  1. #26
    Coding for Jesus LavernGingerich's Avatar
    Join Date
    Jul 2003
    Location
    Tennessee
    Posts
    607
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Do you mean the footer images? Those are background images.

    I specified a width and height to the photo on the contact page and doesn't help, plus the installation questions page does it too and it doesn't have any photos in the right div. Are you talking about photos in the top or left sidebar?
    Yoder's Smoky Mountain Barbecue
    High quality barbeque smokers, pig roasters, and bbq pit grills.
    Pursuing Life Ministries - Jesus has saved me and given me hope.

  2. #27
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Are you talking about photos in the top or left sidebar?
    I'm talking about all your foreground images - It doesn't matter where they are. They must all have the width and height attributes in the html. This does not refer to any background images. Even one image with the height and width missing can cause the rest of the page not to display.

    However this is usually a firefox problem and as you say its IE that has the problem then I will have to have another look and see If I can spot anything. It sounds as there may be "haslayout" issue somewhere and I will need to take a closer look.

    You'll have to wait until later though as the sun is out and I have a drink waiting for me on the garden

    Back later

  3. #28
    Coding for Jesus LavernGingerich's Avatar
    Join Date
    Jul 2003
    Location
    Tennessee
    Posts
    607
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I thought specifying width and height in html was not professional.

    Thanks for checking into this.
    Yoder's Smoky Mountain Barbecue
    High quality barbeque smokers, pig roasters, and bbq pit grills.
    Pursuing Life Ministries - Jesus has saved me and given me hope.

  4. #29
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    I thought specifying width and height in html was not professional.
    Who told you that!

    The width and height in the img src tag are crucial because the browser uses this to allocate the correct amount of room while the page is loading.

    If you don't specify the height and width attributes then either the browser has to wait for each image to load before it can render any more of the page or it carries on rendering the page and the images get misplaced and overlap. This is what very often happens in firefox and happens so often that I wrote a FAQ about it

    I'm having another look at your page shortly.

  5. #30
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    It looks as though the gap is about 110px which happens to be the same size as your absolutely placed header. Therefore I am guessing that IE is getting confused with the length of the page and isn't subtracting the header dimensions.

    Try moving #top so that it is after the footer. IE quite often has problems with absolute elements unless they are at the end of the stacking context and after static content.

    e.g.

    Code:
    <div id="footer">
        <div id="footer-left"> <a href="index.php" title="Madison Vinyl Home Page">Home</a> . <a href="contact.php" title="Contact Madison Vinyl">Contact Us</a> . <a href="sitemap.php" title="Sitemap">Sitemap</a></div>
        <div id="footer-right">Copyright &copy; 2007 Madison Vinyl. Site design by <a href="http://www.newcdesigns.com" target="_blank">New Creation Designs</a>.</div>
        <div id="subfooter"><span>Madison Vinyl Replacement Windows</span><br />
            113 Dingman Hill Road | Bainbridge, NY 13733<br />
            Phone: 607.967.4323</div>
    </div>
    <div id="top">
        <div id="heading">
            <div id="logo">
                <h1><img src="http://www.newcdesigns.com/mv/images/logo.gif" alt="Madison Vinyl Replacement Windows Logo" title="Madison Vinyl Replacement Windows" /></h1>
            </div>
            <div id="infoline1"><img src="http://www.newcdesigns.com/mv/images/vinyl_replacement_windows.gif" alt="Vinyl Replacement Windows" title="Vinyl Replacement Windows" /></div>
            <div id="infoline2">Manufacturing to Installation</div>
            <div id="navbar">
                <ul class="navbar">
                    <li><a href="index.php" title="Madison Vinyl Home">Home</a></li>
                    <li><a href="window-estimate.php" title="Get Free Estimate on Replacement Vinyl Windows">Free Estimates</a></li>
                    <li><a href="contact.php" title="Contact Madison Vinyl">Contact Us</a></li>
                </ul>
            </div>
        </div>
    </div>
    </body>
    </html>
    It seems to much of a coincidence that the gap is 100px and the header is 100px as well so this may solve the problem.

    Try it and see

  6. #31
    Coding for Jesus LavernGingerich's Avatar
    Join Date
    Jul 2003
    Location
    Tennessee
    Posts
    607
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    Who told you that!

    The width and height in the img src tag are crucial because the browser uses this to allocate the correct amount of room while the page is loading.
    I don't think anyone told me, but you are the first to tell me that it's necessary. For some reason, I got the impression that it's clutter in the HTML because I thought the browser would automatically render the image at the correct width.


    Thanks for your input there. I need to start using those attributes.
    Yoder's Smoky Mountain Barbecue
    High quality barbeque smokers, pig roasters, and bbq pit grills.
    Pursuing Life Ministries - Jesus has saved me and given me hope.

  7. #32
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    For some reason, I got the impression that it's clutter in the HTML
    Unfortunately a lot of people think this and it does cause considerable problems. If the dimensions aren't there then the browsers doesn't know the size until its loaded the whole image and by then its too late because other parts of the page have already been drawn.

    You are right that presentational attributes should not be used in the html but the width and height are exceptions to this rule and are completely valid.

    Have you tried moving #top as I mentioned above which I'm hoping will cure the problem.

  8. #33
    Coding for Jesus LavernGingerich's Avatar
    Join Date
    Jul 2003
    Location
    Tennessee
    Posts
    607
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I moved top after footer now, and assigned a height and width on the foreground images on the contact page and it still does it.

    Lavern
    Yoder's Smoky Mountain Barbecue
    High quality barbeque smokers, pig roasters, and bbq pit grills.
    Pursuing Life Ministries - Jesus has saved me and given me hope.

  9. #34
    Coding for Jesus LavernGingerich's Avatar
    Join Date
    Jul 2003
    Location
    Tennessee
    Posts
    607
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hello Paul,

    Did you come up with a solution for me on why it's creating all that space toward the bottom of my page above my footer? It's still leaving that empty space there when it first loads.

    www.newcdesigns.com/mv
    Yoder's Smoky Mountain Barbecue
    High quality barbeque smokers, pig roasters, and bbq pit grills.
    Pursuing Life Ministries - Jesus has saved me and given me hope.

  10. #35
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    I assume we are talking about IE6 still. I'm not seeing any gaps when I look at the page though. Is there a specific trigger for this or does it only happen on certain pages?

    (I'll be back in the morning and take another look)

  11. #36
    Coding for Jesus LavernGingerich's Avatar
    Join Date
    Jul 2003
    Location
    Tennessee
    Posts
    607
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Yes, it's happening in IE6. It does this when the page first loads until you refresh the page. It doesn't always happen, but usually it does. I don't think it's a respecter of pages.
    Yoder's Smoky Mountain Barbecue
    High quality barbeque smokers, pig roasters, and bbq pit grills.
    Pursuing Life Ministries - Jesus has saved me and given me hope.

  12. #37
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,350
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    Hi,

    I've been looking at this on and off all day in IE and i can't get it to wrong at all. Which is a little strange as usually these things are reproducible unless it only happens on slow connections or something like that.

    All I can suggest is that you put the head section back at the top of the html and remove the absolute positioning from it. I'm not sure why you wanted to absolutely place it anyway unless it was a seo thing but then your header had important info in there anyway.

    If everything is back in the flow then the chances are the elements won't be misplaced and if they are then it will tell us to look somewhere else for the answer.


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •