Ask Experts Questions for FREE Help !
Ask
    RickJ's Avatar
    RickJ Posts: 7,762, Reputation: 864
    Uber Member
     
    #1

    Jul 30, 2007, 09:52 AM
    "Stretchable" Image?
    I want to use something like the below image as a webpage header.

    I lay out my sites in a table - and in this case the page width of the table will be 95% rather than a number of pixels.

    I want the width of the image to be equal to the rest of the page.

    ... so can I cut the image into 3 pieces, put them into a 1row 3column table with only the line being in the middle part... then designate the width of the line to be 100% of the cell width so that it will stretch to the appropriate width and meet the line of the left and right part of the image?

    Am I making sense?

    In short, I want the image to be in the first row of the table that's set to be 95% page width, and have the left and right sides of the image line up with the left and right sides of the rest of the page content.

    Thanks!
    Attached Images
     
    jstrike's Avatar
    jstrike Posts: 418, Reputation: 44
    Full Member
     
    #2

    Aug 17, 2007, 07:14 AM
    Did you get this figured out?
    I'm trying to understand what you want but I'm a bit confused...
    You want the image in the first row to stretch the whole width of the table and the table width is 95% of the page width.
    Is the image behind the text?
    RickJ's Avatar
    RickJ Posts: 7,762, Reputation: 864
    Uber Member
     
    #3

    Aug 17, 2007, 08:05 AM
    Thanks, jstrike, but I just went with static.

    What I was trying to do initially is put the 3 boxes and a bit of the line in one static image on the left, then the text section with another bit of the line in a static image on the right, then have a blue line in the middle that stretches with page width since the entire section is sized to percentage of screen.

    ... so in other words, have the line in the middle be whatever size it needs to be - and meet the line in the left and right side - for the viewers screen.

    ... haha probably may still not make sense, but no big deal anyway since the image width is not wider than the screen even for a viewer at 800x600.
    jstrike's Avatar
    jstrike Posts: 418, Reputation: 44
    Full Member
     
    #4

    Aug 17, 2007, 08:30 AM
    Quote Originally Posted by RickJ
    What I was trying to do initially is put the 3 boxes and a bit of the line in one static image on the left, then the text section with another bit of the line in a static image on the right, then have a blue line in the middle that stretches with page width since the entire section is sized to percentage of screen.
    Gotcha (I think)... I was looking at it as a 3 row type of thing but the way you describe it it's 3 columns and the middle column stretches based on the width of the browser.

    Not sure if you tried this or not...
    An "outer" table that has a width of 95%
    A table in the first row of that table that has a width of 100%
    The first column of the first row would have a fixed width and fixed height and have a left alignment. I would go with 3 images and put them in a table rather than one image.
    The second column would have a fixed height, no fixed with.
    The third column would have fixed height/width and a right alignment.

    The blue line would actually be a table in the middle of all that whose width is 100%, a fixed height and whose background color is set to whatever color you want.

    Probably the best, but most difficult way to do this would be to use all CSS and no tables. I've started messing around with it, steep learning curve but it gives you a LOT of flexibility in your design.
    RickJ's Avatar
    RickJ Posts: 7,762, Reputation: 864
    Uber Member
     
    #5

    Aug 17, 2007, 09:35 AM
    Quote Originally Posted by jstrike
    it's 3 columns and the middle column stretches based on the width of the browser.
    Exactly.

    I see what you're saying about doing it as a nested table. That should work. I'll put this thread on my "toolbox" page.

    Yeah, I know, I should learn CSS... but truth is, I've got more work than I can handle doing easy layout-in-tables html sites I've just not been pressed to learn CSS.
    jstrike's Avatar
    jstrike Posts: 418, Reputation: 44
    Full Member
     
    #6

    Aug 17, 2007, 06:49 PM
    I love a good challenge.

    See the attached zip file. I used CSS but it should be easy enough to understand.
    Attached Files
  1. File Type: zip TableTest.zip (5.1 KB, 48 views)
  2. RickJ's Avatar
    RickJ Posts: 7,762, Reputation: 864
    Uber Member
     
    #7

    Aug 20, 2007, 03:45 AM
    Too cool, that's exactly what I was looking for. Thank you!
    I tested it with different resolutions and it works perfect.
    I'm an old dog but I DO love learning new tricks :)

    Stretchy Table
    jstrike's Avatar
    jstrike Posts: 418, Reputation: 44
    Full Member
     
    #8

    Aug 20, 2007, 08:29 AM
    Sometimes new tricks are all us old dogs have left! :)

Not your question? Ask your question View similar questions

 

Question Tools Search this Question
Search this Question:

Advanced Search

Add your answer here.


Check out some similar questions!

Fan Blower not working in "ON" or "AUTO" in heat or AC [ 13 Answers ]

Got home from the Brewer game this afternoon and noticed the house was warm(78). Outside was 91. I checked the T-stat and it was set correct. Noticed the air vents weren't blowing anything. Went outside and the condenser and fan was running fine. Then I went downstairs to the furnace unit to see...

How to displace the loading image with a message like "loading... "? [ 3 Answers ]

How to displace the loading image with a message like "loading"?

Can not "copy", "paste" and "cut" ! [ 2 Answers ]

Last week, my laptop was infected by virus, I sent for repair. After that, I couldn't find "copy" and "cut", and"paste" is in grey colour ! What have to do to have them back ? Can someone help ? Thanks in advance !


View more questions Search