SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Enthusiast
    Join Date
    Feb 2007
    Posts
    69
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    IE6 Probelms again!

    Hey Guys!

    Another IE6 problem!

    Im trying to place an image on a page from google maps, it displays fine in all other browsers apart from IE6:

    http://www.profilecoachbuilders.com/dev/contact.php

    As you see IE6 makes the right side wider for some reason, thus pushing the layout out of line!

    Also, can anyone think of a way of extending the left column right to the bottom of the page, as on pages with large amounts of content like the contact page it just cuts off and looks odd!

    Thanks

    Shaun

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

    This is basic housekeeping errors again

    Your rgt_wrapper is 508px wide.

    Inside that you have placed #content which has a width of 80% and padding of 50px each side making the available space only 306px wide.

    Inside #content you have placed map_container which you have given a width of 425px. That's 119px to wide to fit and therefore the layout gets broken as IE tries to make it all fit.

    Move the map-container out of the content div and it should fit.

    Code:
                        </blockquote>
                    </div><!-- close #content here -->
                    <div id="map_container">
                        <p style="padding-bottom: 5px;"><a href="http://maps.google.co.uk/maps?f=q&amp;hl=en&amp;geocode=&amp;time=&amp;date=&amp;ttype=&amp;q=pr36be&amp;ie=UTF8&amp;om=1&amp;ll=53.93305,-2.842712&amp;spn=0.141487,0.291824&amp;z=11&amp;source=embed" rel="external" style="border: 0px;"><img src="http://www.profilecoachbuilders.com/dev/images/map.gif" alt="Click to Enlarge - Google Map showing the location of Profile Coachbuilders" width="425" height="350" /></a></p>
                        <p style="padding-bottom: 5px; text-align: right;">Map by: <a href="http://maps.google.co.uk/maps" title="Google Maps UK" rel="external">Google Maps</a></p>
                    </div>
                    <p align="center"><a href="#top">Back to Top</a></p>
                </div>
            </div>
            <!--End of Right Wrapper-->
        </div>
        <div style="clear:both;height:1px;overflow:hidden"></div>
    If you want the left shaded side to continue then use a repeating image of the correct width and repeat it down the left side of the main container.

    The same way that all thee columns are created in this layout using this image.

  3. #3
    SitePoint Enthusiast
    Join Date
    Feb 2007
    Posts
    69
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Its always the must simple things that you over look!

    Thanks All Paul

    Shaun


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
  •