1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

really ANNOYING firefox/ie incompatability :very confused:

Discussion in 'CSS' started by david_sakh, Nov 29, 2004.

  1. #1
    I began work on an experimental page earlier today and I stopped about an hour into it to check it out in multiple browsers. For some reason it looks like i want it to in IE but absolutely horrible in Firefox because the images on the four corners of the table aren't loading. Is this a CSS problem, an image attribute="100%" problem, an image tiling issue (the vertically tiled images don't load either) or something else? I know this may take a few minutes, but I've tried to post all the relevant information.

    Look at this in both Firefox and IE:

    http://www.exclusivefreegames.com/templates/Dec2004/newlayout.shtml

    bear in mind I am really really bad with tables, so this could be an easy problem.

    here is the relevant part of the html code:
    SEMrush
    
    <tr>
    <td width="28" height="32" align="left">
    <img src="outline_topleft.GIF" width="100%" height="100%">
    </td>
    <td class="OUTLINEtop" width="100%" height="18" align="center" valign="top">
    <a href="http://www.exclusivefreegames.com/"><font class="smallwhite">Home<font></a>
    </td>
    <td width="25" height="32" align="left">
    <img src="outline_topright_edged.gif" width="100%" height="100%">
    </td>
    
    </tr>
    <td class="OUTLINEleft" valign="top" width="24">
    </td>
    <td width="100%">
                                  <table cellpadding="0" cellspacing="0">
                                  <!--CONTENTS TABLE-->
                                  <tr>
                                  <td>
    (blah)
                                  </td>
                                  </tr>
                                  </table>
                                  <!--END CONTENTS TABLE-->
    </td>
    <td class="OUTLINEright" width="24">
    </td>
    </tr>
    
    
    
    
    
    <tr>
    <td class="outlinebottom" width="100%" height="32" align="center" valign="top" colspan="3">
    </td>
    
    
    </tr>
    
    
    Code (markup):

    And here is the relevant CSS:

    
    .OUTLINEtop {
    background-image: url("http://www.exclusivefreegames.com/templates/Dec2004/outline_top.GIF");
    background-repeat: repeat-x;
    font-family:Arial,Veranda;
    color: white;
    font-size: 10px;
    }
    
    .OUTLINEbottom {
    background-image: url("http://www.exclusivefreegames.com/templates/Dec2004/outline_bottom.gif");
    background-repeat: repeat-x;
    font-family:Arial,Veranda;
    color: white;
    font-size: 10px;
    }
    
    .OUTLINEleft {
    background-image: url("http://www.exclusivefreegames.com/templates/Dec2004/outline_left.gif");
    background-repeat: repeat-y;
    }
    
    .OUTLINEright {
    background-image: url("http://www.exclusivefreegames.com/templates/Dec2004/outline_right.gif");
    background-repeat: repeat-y;
    }
    
    
    Code (markup):
     
    david_sakh, Nov 29, 2004 IP
    SEMrush
  2. ginostylz

    ginostylz Well-Known Member

    Messages:
    240
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    138
    #2
    ginostylz, Nov 29, 2004 IP
  3. david_sakh

    david_sakh Peon

    Messages:
    1,225
    Likes Received:
    29
    Best Answers:
    0
    Trophy Points:
    0
    #3
    thanks for that link, but I fixed all of the problems but it still doesn't load the images in firefox. :(

    also note that the above html code has changed, and will be changing again if i get more help, so look at the source code instead b/c for some reason I can't edit my first post again.... :confused:

    look - if anyone knows how achieve the simple effect I want in a less haphazard and experimental way that will work in all browser, at least show me a link to your site and let me have a look see, would you? - thanks.
     
    david_sakh, Nov 30, 2004 IP
  4. mopacfan

    mopacfan Peon

    Messages:
    3,273
    Likes Received:
    164
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Just a quick glance tells me your table(s) are not properly formed. What kind of editor are you using to code this?
     
    mopacfan, Nov 30, 2004 IP
  5. TwisterMc

    TwisterMc Mac Guru

    Messages:
    972
    Likes Received:
    13
    Best Answers:
    0
    Trophy Points:
    0
    #5
    1) Correctly close your font tag please
    2) the images won't show up because their size is 100% x 100%, however that isn't working. Put the actual size of the images in and you'll be fine. Don't define the image size in the TD tag. That just won't work.
     
    TwisterMc, Nov 30, 2004 IP
  6. Dji-man

    Dji-man Peon

    Messages:
    185
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    0
    #6
    Your <td> on each side are empty and your center TDs have a width of 100%. Mozilla will do as told and try to maximize the center cell to 100%, so it eliminates the side TDs as they are empty. Put something in or change the width of your center cells and they'll appear.
     
    Dji-man, Nov 30, 2004 IP
  7. david_sakh

    david_sakh Peon

    Messages:
    1,225
    Likes Received:
    29
    Best Answers:
    0
    Trophy Points:
    0
    #7
    thanks guys

    also, i don't have the money to buy an editor, so I do all my coding in notepad, so it's easy for me to get confused.

    I had always thought it would try to maximize the alloted area within the constraints that it had - I guess I was grossly mistaken.
     
    david_sakh, Dec 1, 2004 IP
  8. dazzlindonna

    dazzlindonna Peon

    Messages:
    553
    Likes Received:
    21
    Best Answers:
    0
    Trophy Points:
    0
    #8
    David, HTMLKit is a great editor and it is free. You can click a button, and it will inform you of coding problems such as this.
     
    dazzlindonna, Dec 1, 2004 IP
  9. david_sakh

    david_sakh Peon

    Messages:
    1,225
    Likes Received:
    29
    Best Answers:
    0
    Trophy Points:
    0
    #9
    thanks! I think I actually may have downloaded it some time ago - I'll have to boot it up again. but i have one last question, while you guys are here:

    the reason i did that whole image width="100%" thing was because it wouldn't display properly if I used the image alone. for some reason, IE & netscape would put about 2 pixels of table cell whitespace below the image, while Firefox wouldn't. everything is working now, but the whitespace remains...
     
    david_sakh, Dec 1, 2004 IP
  10. david_sakh

    david_sakh Peon

    Messages:
    1,225
    Likes Received:
    29
    Best Answers:
    0
    Trophy Points:
    0
    #10
    heh - its fixed now. No worries all, and many thanks.
     
    david_sakh, Dec 2, 2004 IP
  11. chachi

    chachi The other Jason

    Messages:
    1,600
    Likes Received:
    57
    Best Answers:
    0
    Trophy Points:
    0
    #11
    What is wrong with writing HTML in a text editor? :) I use TextPad (shareware) which does not put all of those junky windows characters in it and will do some nice color coding of the html tags for you. It is really great to have around as a text editor on a windows box.
     
    chachi, Dec 2, 2004 IP