Advertisement
If you have a new account but are having problems posting or verifying your account, please email us on hello@boards.ie for help. Thanks :)
Hello all! Please ensure that you are posting a new thread or question in the appropriate forum. The Feedback forum is overwhelmed with questions that are having to be moved elsewhere. If you need help to verify your account contact hello@boards.ie
Hi there,
There is an issue with role permissions that is being worked on at the moment.
If you are having trouble with access or permissions on regional forums please post here to get access: https://www.boards.ie/discussion/2058365403/you-do-not-have-permission-for-that#latest

internet explorer, divs, css and images

  • 24-09-2005 8:42pm
    #1
    Closed Accounts Posts: 658 ✭✭✭


    I didnt know how to sum up this problem but here goes.

    Basically I have a div on my webpage that is a certain height and width. It is positioned absolutely and it has a black border of 1px in width. Now when I insert an image into this div, it shows up ok in firefox with the black border around it, but in internet explorer, the border looks out of place with the other bordered div's around it. is there any hack out there to counter this ?

    Also another thing I notice is that when I put images into an absolutely positioned div with a border, there is a little white margin at the bottom of them when they are rendered in IE, but theyre fine in firefox. Any ideas ??

    any help appreciated, thanks


Comments

  • Registered Users, Registered Users 2 Posts: 5,356 ✭✭✭NeVeR


    can you post the HTML so i can have a look.


  • Closed Accounts Posts: 658 ✭✭✭pontovic


    NeVeR wrote:
    can you post the HTML so i can have a look.

    yeah sure

    basically it goes like
    <html>
    <head>
    <link rel="stylesheet" type="text/css" href="./styles/style.css"/>
    </head>
    <body>
    <div id="imagebox">
    <img src="./images/image.jpg">
    </div>
    </body>
    </html>
    

    and in my styles.css file i would have
    
    div#imagebox
    {
        position: absolute;
        border: 1px solid #000000;
        top: 100;
        left: 30;
        width: 130;
        height: 90;
    }
    
    

    The image I insert in the DIV element is 130 * 90.


  • Closed Accounts Posts: 658 ✭✭✭pontovic


    have a look at this page in firefox and then in internet explorerhttp://www.mdal.ie/karl and you will see exactly what I mean


  • Registered Users, Registered Users 2 Posts: 68,317 ✭✭✭✭seamus


    Ah yes. This is the biggest pain. IE doesn't calculate element size correctly, so you get left with this. If you try and fix it in IE, it stops working in FF, and vice-versa.

    The only thing I can think of is to try and make the dividers into 0-padding and 0-margin divs.
    so it'll go like
    <html>
    <head>
    <link rel="stylesheet" type="text/css" href="./styles/style.css"/>
    </head>
    <body>
    <div id="imagebox">
              <img src="./images/image.jpg">
    </div>
    <div id="imageSpacer">&nbsp;</div>
    <div id="imagebox">
              <img src="./images/image2.jpg">
    </div>
    </body>
    </html>
    
    Etc. Then it should be possible to caculate the exact height and width correctly. Someone else may have a better fix.


  • Registered Users, Registered Users 2 Posts: 35,524 ✭✭✭✭Gordon


    I took out the width and height attributes on the div for the images and it looks ok now on IE for Mac.


  • Advertisement
  • Closed Accounts Posts: 658 ✭✭✭pontovic


    Gordon wrote:
    I took out the width and height attributes on the div for the images and it looks ok now on IE for Mac.

    really ? i initially had them out but I put them in to see would IE render them correctly and it didnt work. you removed the height and width attributes for the images ?


  • Registered Users, Registered Users 2 Posts: 68,317 ✭✭✭✭seamus


    Doesn't sort it for IE on WinXP :)


  • Closed Accounts Posts: 658 ✭✭✭pontovic


    i tried putting into my css code for the divs

    padding: 0;

    and it made no difference.


  • Registered Users, Registered Users 2 Posts: 35,524 ✭✭✭✭Gordon


    Why doin't you just make the image have a border of "1px" <img source "blah" border="1"> and contain them within one div that has the same amount of padding around it. Then you just need one div as opposed to img1div img2 div etc. That would work instead no?


  • Closed Accounts Posts: 658 ✭✭✭pontovic


    ok gordon i have made the changes based on your suggestion and it looks better so thanks for that. is IE renowned for being a pain in the arse re: not following standards ? or something ?


  • Advertisement
  • Registered Users, Registered Users 2 Posts: 35,524 ✭✭✭✭Gordon


    I think so yeah.


  • Closed Accounts Posts: 132 ✭✭canker


    is IE renowned for being a pain in the arse re: not following standards ? or something ?

    Only firefox ppl think this!

    Follow IE's standards and you wont have any problems! :D


  • Closed Accounts Posts: 658 ✭✭✭pontovic


    well from what i see internet explorer isn't doing exactly as it should, and firefox is. unless i'm mistaken in my code, doesnt that make firefox more compatible ?


  • Closed Accounts Posts: 132 ✭✭canker


    more compatible with what?

    The only thing a website needs to be compatible with is its users. The vast majority of users use IE. Therefore if you want a more compatible website => design to work in IE first.

    Ideally of course you should design to work in all. But if there is an issue with something not happening right make sure you get ot right in IE first.
    isn't doing exactly as it should

    It can't not (bad grammer to emphasise the point) do what it should, surely you mean It's not doing as firefox should.


  • Closed Accounts Posts: 658 ✭✭✭pontovic


    look mate im not going to get into this, all i want is to fix this problem.


  • Registered Users, Registered Users 2 Posts: 2,170 ✭✭✭Serbian


    canker wrote:
    stuff

    It's pretty obvious that you are just saying this stuff because you have a chip on your shoulder about Firefox users; your signature just reinforces this. Maybe it's the over-zealous minority that try to force the browser down your throat, maybe it's a lack of understanding of the difference between IE and Firefox or most likely, it's just plain trolling.

    No matter what it is, the facts cannot be denied that IE does not follow web standards. You can read about Internet Explorer's efforts to become standards compliant in the Internet Explorer Blog on the MSDN which is written by the IE developers.

    You should design to the standards and then employ whatever hacks or workarounds needed to make it work in all browsers. You'd be suprised how much easier it is to follow the W3C guidelines and then employ hacks rather than vice-versa.


  • Closed Accounts Posts: 132 ✭✭canker


    I have no chip on my shoulder. Apologies If I came across too strong on this subject. I agree entirely that if web browsers implemeted mutually agreed standards in a uniform manner everyone (web users and developers) would be a whole lot happier. The point I tried to make (to help out pontovic with his original query) is that this is not currently the case and in order to deliver the best website possible he should make sure it works in IE (rather than follow the standards 100% because IE doesnt implement them properly) because the majority of his users are going to be using it.

    the nature of this quote
    Only firefox ppl think this!

    Follow IE's standards and you wont have any problems! biggrin.gif

    was supposed to be funny (see the grinning face?). Guess I'm not that funny :(

    :) now smiley face makes everyone happy again!


  • Registered Users, Registered Users 2 Posts: 4,003 ✭✭✭rsynnott


    canker wrote:
    I have no chip on my shoulder. Apologies If I came across too strong on this subject. I agree entirely that if web browsers implemeted mutually agreed standards in a uniform manner everyone (web users and developers) would be a whole lot happier. The point I tried to make (to help out pontovic with his original query) is that this is not currently the case and in order to deliver the best website possible he should make sure it works in IE (rather than follow the standards 100% because IE doesnt implement them properly) because the majority of his users are going to be using it.

    Has it occurred to you that if they ever do fix IE, "IE-only" sites will be viewable on nothing?


  • Closed Accounts Posts: 132 ✭✭canker


    Yes, that is why I would never promote building an "IE-only" website.


  • Closed Accounts Posts: 132 ✭✭canker


    This is what I ment to say
    Serbian wrote:
    You should design to the standards and then employ whatever hacks or workarounds needed to make it work in all browsers. You'd be suprised how much easier it is to follow the W3C guidelines and then employ hacks rather than vice-versa.

    It is exactly the way I design websites and I would encourage everyone else to do likewise.


  • Advertisement
Advertisement