Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 11 of 11

Thread: IE versus FF

  1. #1
    New to the CF scene
    Join Date
    Nov 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    IE versus FF

    RE: http://users.accesscomm.ca/kendemchu...ation_tmp.html

    in IE there are lines, in FF there are not. Why


    I was trying to display a text window, on hover.
    maybe there is a better way in CSS ??

  • #2
    Regular Coder
    Join Date
    Jul 2009
    Posts
    187
    Thanks
    16
    Thanked 8 Times in 8 Posts
    1 - Are they lines or are they spaces?
    IE has a tendancy to have different measurements, I don't know why, used to happen to me, doesn't anymore, maybe an update I don't know xD

    2 - You might want to check out the hover on the center orb in IE, it goes over the edge and text can't be seen.

    3 - next insert this at the top of your css:
    Code:
    * {
    borders: none;
    padding: 0;
    margin: 0;
    }
    This way if it is borders they will be removed.

    4 - if they are spaces, fiddle around with margins, heights, sometimes even recoding that section is the best way to go but constantly check for changes in the browsers, eventually it will become as a standard so you won't need to keep checking and comparing.

    This way, if you start off with no lines but at some point they turned up you know what caused it and we will have more to go by to help out.

  • #3
    Master Coder
    Join Date
    Apr 2003
    Location
    in my house
    Posts
    5,211
    Thanks
    39
    Thanked 201 Times in 197 Posts
    better to use

    Code:
    * {
    border:0;
    padding:0;
    margin:0;
    }


    Edit:
    Also, validate your page at http://validator.w3.org/check?verbos...ation_tmp.html 16 errors.
    and what are all the 'empty divs for?
    you shouldn't need all those spacer gifs in your table - very 1999. The need for them should laregly go, when you add the css snippet to your css.



    welcome to CF. I only just realised it was your first post.
    bazz
    Last edited by bazz; 11-01-2009 at 11:30 PM.
    "The day you stop learning is the day you become obsolete"! - my late Dad.

    Why do some people say "I don't know for sure"? If they don't know for sure then, they don't know!
    Useful MySQL resource
    Useful MySQL link

  • #4
    Regular Coder
    Join Date
    Jul 2009
    Posts
    187
    Thanks
    16
    Thanked 8 Times in 8 Posts
    Quote Originally Posted by bazz View Post
    better to use

    Code:
    * {
    border:0;
    padding:0;
    margin:0;
    }


    Edit:
    Also, validate your page at http://validator.w3.org/check?verbos...ation_tmp.html 16 errors.
    Lool, Kind of Ironic how you ended that post "Validation" XD...

    @Bazz
    Its actually better to use border: none; LOL, do you use the CSS validator? :P "border: 0;" is invalid.

    siggy
    I just checked out the code, and that portion of the code where it is coded in tables, looks like it has been generated by a program such as photoshop or fireworks built in html creator, if it is I strongly advise I against this.

    Plus coding layouts in tables is bad anyway.

    Also, welcome to the site
    Last edited by Jazz914; 11-02-2009 at 02:11 AM.

  • #5
    New to the CF scene
    Join Date
    Nov 2009
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    some "fixes" - still poor

    spacer-gifs gone
    border= none added
    no css errors

    still does not look right


    I used a table to display the rollover text - cause it displayed nicely

    if there is a nice snippet of code out there, (to do this)
    please point me...

  • #6
    Master Coder
    Join Date
    Dec 2007
    Posts
    6,682
    Thanks
    436
    Thanked 890 Times in 879 Posts
    Quote Originally Posted by siggy View Post
    spacer-gifs gone
    border= none added
    no css errors

    still does not look right


    I used a table to display the rollover text - cause it displayed nicely

    if there is a nice snippet of code out there, (to do this)
    please point me...
    each browser have a default style therefor is a good idea to add a "global reset" as bazz show you in his post. There you can "reset" anything is different in browsers not only the margin, padding and border.
    Be aware that anything you put inside will slow down the load of the page since is applyed for each element in the page, so avoid to put there what you don't really need.

    best regards

  • #7
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,957
    Thanks
    9
    Thanked 727 Times in 721 Posts
    Well, you've got quite a lot of gaps in FF3 as well as IE.

    There are two reasons for these gaps:

    Some are caused by the default top and bottom margins on <p> tags applied by FF. Applying:

    Code:
    td p{margin:0}
    should sort these out. Or apply a global reset as bazz suggested.

    The others are spaces underneath images, which result because <img> is an inline element, and in strict mode the browser allows space for the "tails" of g/y etc. Sort this by setting <img> elements as block elements via:

    Code:
    img{display:block}
    Incidentally, border:0 is valid, border:none is valid, borders:none isn't.
    Last edited by SB65; 11-02-2009 at 11:52 AM.

  • #8
    Regular Coder
    Join Date
    Jul 2009
    Posts
    187
    Thanks
    16
    Thanked 8 Times in 8 Posts
    Quote Originally Posted by SB65 View Post
    Well, you've got quite a lot of gaps in FF3 as well as IE.

    Incidentally, border:0 is valid, border:none is valid, borders:none isn't.
    Its perfectly fine in my FF3 O.o

    EDIT: We are both wrong where the border thing comes in xP
    (Strike through text here)
    Mis read your post, I don't know where you got "borders" from though xD

    border: none; AND border: 0; are both valid, I put just "border:0;" into the validator instead of something like
    Code:
    *  {
    border : 0;
    border : none;
    }
    Both are valid! Nvm my rubbish earlier xD
    Last edited by Jazz914; 11-02-2009 at 12:22 PM.

  • #9
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,957
    Thanks
    9
    Thanked 727 Times in 721 Posts
    See attachment for screenshot in FF3.0. Same in Chrome 3, Opera 9 and Safari 4.

    Quote Originally Posted by Jazz914 View Post
    I don't know where you got "borders" from though xD
    Typo in your post #2.
    Attached Thumbnails Attached Thumbnails IE versus FF-fireshot-capture-088-planet-scuba-regina-users_accesscomm_ca_kendemchuk_test_education_.jpg  

  • #10
    Regular Coder
    Join Date
    Jul 2009
    Posts
    187
    Thanks
    16
    Thanked 8 Times in 8 Posts
    My bad, I thought you meant the latest firefox (3.5.4).

  • #11
    Senior Coder
    Join Date
    Feb 2009
    Location
    Ilkley, West Yorkshire, UK
    Posts
    2,957
    Thanks
    9
    Thanked 727 Times in 721 Posts
    Looks the same for me in that as well.


  •  

    Posting Permissions

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