vertical image streching issue in ie/firefox- help!

Discussion in 'Web Design and Development' started by virus1, Aug 17, 2006.

  1. virus1 macrumors 65816

    virus1

    Joined:
    Jun 24, 2004
    Location:
    LOST
    #1
    I am working on the design for this site, and i am having a compaitbility problem with ie. the problem is that the shadows on the left and the right are streched vertically with this attribute in the image tag: height="100%". now i know that is not the usual way of doing that, but it works fine in safari, but not ie or firefox. is there any other way of vertically streching images to thier maximum height?
     
  2. supermario19 macrumors member

    Joined:
    Aug 17, 2006
    #2
    I would say to try just making the image whatever size you need it instead of trying to stretch it. But I'm sure someone else has a better idea.
     
  3. virus1 thread starter macrumors 65816

    virus1

    Joined:
    Jun 24, 2004
    Location:
    LOST
    #3
    yeah the problem is i dont' want those images to strech the page, but they need to extend to thier fullest lengths in case the page is long.
     
  4. virus1 thread starter macrumors 65816

    virus1

    Joined:
    Jun 24, 2004
    Location:
    LOST
    #4
    ha.. well while i was looking for an example of where this was used in other websites, i had trouble finding it, but it was right under my nose this entire time. there is some kind of use for it on the apple osx page here. i tried to take apart the page to see how the white glow on the sides are done, but i couldn't figure it out. anyone good at taking apart code?
     
  5. iceprincess0966 macrumors newbie

    Joined:
    Jul 13, 2006
    #5
    Hi,
    The way you're doing it won't work. You need to take the image out of the HTML and put it in your CSS.

    .sidebar_left {
    height:100%;
    background-image:url(siteimages/leftblend.png);
    background-position:top right;
    background-repeat:repeat-y;
    }

    Then it should display the image along the right side of the table cell, all the way to the bottom. There's shorthand for that code, which you can find on the web... but this seems easiest to understand when you're just starting out.

    Do the same thing on the other side, only set the position to "top left" and call the class ".sidebar_right".

    Oh, and you should use all lower-case in CSS.

    Good luck!

    Michelle
     
  6. virus1 thread starter macrumors 65816

    virus1

    Joined:
    Jun 24, 2004
    Location:
    LOST
    #6
    thanks so much! now i got the sidebars working in all browsers, so it looks perfect in firefox and safari, but there is a strange white bar to the right of the header in ie, and it is the last flaw i can find, but is odd because it is only in ie. any ideas?
     
  7. homerjward macrumors 68030

    homerjward

    Joined:
    May 11, 2004
    Location:
    fig tree
    #7
    before you put your final site up, please, please make sure you use relative links. *never* use absolute links within your site; moving the site will completely bork it. all the links you have currently lead to a location on your mac's hard drive.
     
  8. iceprincess0966 macrumors newbie

    Joined:
    Jul 13, 2006
    #8
    Hi again. Your shadows look great.

    I wonder if this is the problem?

    <table width="709" height="171%" border="0" align="center" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
    <tr>
    <td height="90" colspan="3" bgcolor="#000000" class=".headercell"><a href="index.html"><img src="siteimages/header.gif" alt="Troop 57 Header" width="700" height="90" border="0" align="left"></a></td>
    </tr>

    Your table is 709 px and your image is only 700px wide. Where are the extra 9px coming from?

    I learned HTML recently enough that I've rarely had to use tables, so it's not my area of expertise. I could be way off the mark.
     
  9. virus1 thread starter macrumors 65816

    virus1

    Joined:
    Jun 24, 2004
    Location:
    LOST
    #9
    still not working, but thanks for your help. if anyone else has any ideas, i would really love some help!
     
  10. virus1 thread starter macrumors 65816

    virus1

    Joined:
    Jun 24, 2004
    Location:
    LOST
    #10
    obviously i haven't set up the links. but in many circumstances, absolute links are very useful. i plan on using them for the images of the site.
     

Share This Page