SitePoint Sponsor

User Tag List

Results 1 to 8 of 8
  1. #1
    SitePoint Guru
    Join Date
    Jul 2002
    Location
    space
    Posts
    845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    <div> Firefox problem

    Hello,

    I have a table that has this cell in it:

    Code:
    <td>
     
    <div style="float: left; width: 100%; height: 100%" align="left"><img src="images/test.gif" width=50 height=50 border=0></div>
     
    <a href="http://www.yahoo.com" target="new"><img src="images/graphic.gif" width=15 height=15 border=0></a>
     
    </td>
    In FF, this line doesn't show:

    <a href=http://www.yahoo.com target="new"><img src="images/graphic.gif" width=15 height=15 border=0></a>

    How can I make it show in FF too? It works fine in IE.

  2. #2
    SitePoint Addict
    Join Date
    Mar 2005
    Location
    Toronto
    Posts
    378
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Sorry but can you be a little bit more specific and show an online example please, it would make it easier to help
    In search of the clouds...and maybe some work

  3. #3
    SitePoint Guru
    Join Date
    Jul 2002
    Location
    space
    Posts
    845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Here is more simplified code:

    In Firefox, GRAPHIC_2.GIF doesn't show up. The browser doesn't even read it. But is shows up fine in Explorer.

    <table>
    <table border=0 cellspacing=0 cellpadding=0>

    <tr>
    <td>

    <div style="float: left; width: 100%; height: 100%" align="left"><img src="GRAPHIC_1.GIF"></div>

    <img src="GRAPHIC_2.GIF">

    </td>
    </tr>

    </table>

    It must have something to do with the <div>. But what can I do about this?
    Last edited by johnny190; Jul 16, 2006 at 13:01.

  4. #4
    SitePoint Wizard drhowarddrfine's Avatar
    Join Date
    Aug 2005
    Posts
    3,438
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It works OK for me. In your post you call it GRAPHIC-2 but in your code you say GRAPHIC_2. Is that the problem?

  5. #5
    SitePoint Guru
    Join Date
    Jul 2002
    Location
    space
    Posts
    845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi there... I edited that, that was just a mistake in my post. GRAPHIC_2.GIF really doesn't show up in Firefox... if you copy and paste the code you will see what I mean. (you'll see 1 broken image instead of 2). I'm using version 1.5.0.4.

    Thanks.

  6. #6
    Non-Member deathshadow's Avatar
    Join Date
    Jul 2006
    Location
    Dublin, NH
    Posts
    901
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Float:left + width:100% = 0 wrap.The second image IS showing up... Right UNDERNEATH the first one. Fix the width of the DIV to that of your image, and the second image should appear to it's right.

    Also Height=100% on a DIV doesn't generally work cross browser very well (if at all) and is probably confusing the matter.

    Honestly you probably shouldn't bother putting the image in a <div> in the first place, but instead should be styling the image directly. (I seem to be seeing a lot of wasted use of DIV lately)

    Code:
    <td>
      <img src="images/test.gif" alt="test" style="float:left; width:50px; height:50px; border:none;" />
       <a href="http://www.yahoo.com" target="new">
         <img src="images/graphic.gif" alt="graphic" style="width:15px; height:15px; border:none;" />
       </a>
    </td>
    I THINK that will do what you are trying to do.

  7. #7
    SitePoint Guru
    Join Date
    Jul 2002
    Location
    space
    Posts
    845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Almost there... now there just seems to be a small space between graphic.gif and the left-side of the page (in IE not FF)... I want it to be flush to the left, but there appears to be maybe 2px or 3px on the left-side of the image (white space).

    Thanks again.

  8. #8
    SitePoint Guru
    Join Date
    Jul 2002
    Location
    space
    Posts
    845
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Got it to work... thanks for the help


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
  •