SitePoint Sponsor

User Tag List

Results 1 to 9 of 9
  1. #1
    SitePoint Member merdok's Avatar
    Join Date
    Mar 2005
    Location
    Hull
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Angry odd behaviour, resizing not working and phantom margins

    Hi Guys,

    I'm currently finishing the development of the new website for the University of Hull, the website uses two stylesheets, one for IE6 and one for everything else.

    The IE6 template needs quite a bit of tweaking, but now I seem to have some problems with it whcih I cannot figure out.

    Firstly, only the left column will allow me to resize it, if I try to increase or decrease the centre/right columns there are no changes whatsoever.

    Secondly, there is a margin either just after the centre, or just before the right column which I cannot find in my CSS.

    It could just be me being stupid, I wrote this CSS many months ago and its been a hell of a long hard summer getting this sorted and I'm completely burned out, so if it is a simple thing then i'm sorry to pester you lot with it, but its one week till deadline and I'm starting to go bananas.

    The site is located at http://chorlton.lib.hull.ac.uk/hull-site/index.html

    the css can be found at http://www.hull.ac.uk/05/elements/ie6.css

    Cheers,

    Lx.

  2. #2
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I don't really have time at the moment to investigate where the problem is exactly but IE6 does have a bug where left margin's are doubled on floated elements.

    All you need to do is apply display: inline; at the end of these styles to fix this issue.

    Hope that helps but I can probably have a look in the morning if you've not managed to solve the problem.

  3. #3
    SitePoint Member merdok's Avatar
    Join Date
    Mar 2005
    Location
    Hull
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thank you for the suggestion, this did alleviate the problem somewhat, but it doesnt appear to have worked for everything.

  4. #4
    SitePoint Member merdok's Avatar
    Join Date
    Mar 2005
    Location
    Hull
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    it seems to me that if I can get the 'useful' div to resize to stay inline with the rest of the left menu everything will be in place then. However it doesnt seem to want to resize.

  5. #5
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Looks fine to me in IE6.

    Keep in mind that if you're using conditional comments and are using multiple IE versions on your machine then they'll assume that the IE you are using is the latest installed on your machine.

    i.e. If you have IE7 installed then the browser will ignore lte IE 6 comments even if you are using IE6.

  6. #6
    SitePoint Member merdok's Avatar
    Join Date
    Mar 2005
    Location
    Hull
    Posts
    6
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Thats not really an issue for us so we dont mind that too much Turns out that it was a simple fix in the end... there was a width applied to a <li> tag which I'd completely forgotten about... I set that to 100&#37; and bob's your uncle!

    Thanks for the help with the rest though.

  7. #7
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The issue I raised about conditional comments isn't really an issue on the web as presumably people using earlier versions of IE only have those installed. The reason I raised the issue is purely because it can cause problems when testing the site as you may not be seeing exactly how an IE6 user will see the site.

    Glad you've sorted it although unless you're applying display: inline; or a float to the <li> you shouldn't need a width on the <li> at all. An <li> is a block element and will therefore always expand to take up the remaining space available within it's parent's container.

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

    You shouldn't be using the whole css file in the IE only file as that will make all IE users load the first file and then have to load the file again and that is a complete waste of bandwidth and rather annoying .

    The IE only file should only contain specific IE only code and usually only runs to half a dozen lines of code (if you have more than that then you either have a very large site or you are doing something wrong). The normal stylesheet is loaded and then you just add the fixes via the conditional comment linked file. There is no need to include all the styles again and in fact makes maintenance and debugging a nightmare.

    I would guess that you wouldn't need more that a few IE hacks for that page.

  9. #9
    SitePoint Wizard bronze trophy DaveWoods's Avatar
    Join Date
    Dec 2004
    Location
    Derbyshire - UK
    Posts
    2,651
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Completely agree, only include the bug fixes in your IE stylesheet as you should have a default stylesheet anyway that is applied to all browsers and the just specific styles should be over written in your conditional commented stylesheet as Paul has already advised.

    I'd not looked in the IE css file so presumed that you'd only added the bug fixes so well done to Paul for spotting that one


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
  •