|
Align to bottom of table cell. |
|
ad (14:10 13/3/2008) ad (14:21 13/3/2008) filecore (14:22 13/3/2008) ad (14:35 13/3/2008) monkeyson2 (15:19 13/3/2008) andypoole (22:35 13/3/2008) moss (23:08 13/3/2008) filecore (05:54 14/3/2008) VincceH (09:34 14/3/2008) filecore (19:03 16/3/2008) cakewalker (21:52 16/3/2008) rich (13:15 20/3/2008) cakewalker (18:25 16/3/2008) Matthew (23:09 19/3/2008)
|
|
Andrew Duffell |
Message #106743, posted by ad at 14:10, 13/3/2008 |
Posts: 3262
|
<table border="1"> <tr> <td height="400" width="400">
<div> < img src="tag.png" alt="" /> </div>
<div> < img src="image.png" alt="" /> </div>
</td> </tr> </table>
How can I make image.png sit at the bottom of the table cell whilst tag.png sits at the top?
Cheers, |
|
[ Log in to reply ] |
|
Andrew Duffell |
Message #106745, posted by ad at 14:21, 13/3/2008, in reply to message #106743 |
Posts: 3262
|
ignore the space between < and img It's the only way I could get it to display on TIB. |
|
[ Log in to reply ] |
|
Jason Togneri |
Message #106746, posted by filecore at 14:22, 13/3/2008, in reply to message #106743 |
Posts: 3868
|
Top tip for excitable HTML learners: if you see it done on a website and want to do it, go to View Source. Now go and find a website where you see it implemented. |
|
[ Log in to reply ] |
|
Andrew Duffell |
Message #106747, posted by ad at 14:35, 13/3/2008, in reply to message #106746 |
Posts: 3262
|
The point is I don't see it implemented anywhere.
I mean, I could use an extra table cell, but I'm just wondering if it is possible to vertically align to separate elements within a table cell, one to the top and one to the bottom. |
|
[ Log in to reply ] |
|
Phil Mellor |
Message #106748, posted by monkeyson2 at 15:19, 13/3/2008, in reply to message #106747 |
Please don't let them make me be a monkey butler
Posts: 12380
|
Try this. You could probably remove the inner div tags and apply the styles to the images directly.
<table border="1"> <tr> <td height="400" width="400" style="position:relative">
<div style="position:absolute; top:0"> < img width="400" height="100" src="tag.png" alt="" /> </div>
<div style="position:absolute; bottom:0"> < img width="400" height="100" src="image.png" alt="" /> </div>
</td> </tr> </table>
Why are you using tables for layout anyway, you evil person you? |
|
[ Log in to reply ] |
|
Andrew Poole |
Message #106752, posted by andypoole at 22:35, 13/3/2008, in reply to message #106748 |
Posts: 5558
|
Why are you using tables for layout anyway, you evil person you? Because CSS layouts are a bitch to write and tables are easier and work just as well?
*hides*
As for the problem at hand, I'd personally use an extra table cell and use valign="top" or valign="bottom". It depends what else is going in the table, I suppose. |
|
[ Log in to reply ] |
|
John Hoare |
Message #106753, posted by moss at 23:08, 13/3/2008, in reply to message #106752 |
Posts: 9348
|
I can't write sites with table layouts for toffee. On the other hand, CSS layouts are second-nature to me now.
Neither is easier or harder than the other - it's just what you're used to. |
|
[ Log in to reply ] |
|
Jason Togneri |
Message #106754, posted by filecore at 05:54, 14/3/2008, in reply to message #106753 |
Posts: 3868
|
Yepyep. By the time that I can truly say I understand how to layout tables, I'm onto CSS - and I'm beginning to get a fair grasp of CSS layout too. Check out some of the positioning used for main links and page backgrounds (all made of text) in this design, including through to the guestbook script. |
|
[ Log in to reply ] |
|
VinceH |
Message #106756, posted by VincceH at 09:34, 14/3/2008, in reply to message #106754 |
Lowering the tone since the dawn of time
Posts: 1600
|
You might want to consider setting sensible colours (or not setting any colours at all) in the <body> tag so that the page degrades gracefully for non-CSS browsers.
Otherwise, quite a nice design.
(Doesn't work right in the version of Netsurf I have, but that's probably a not-quite-done-yet issue with Netsurf.) |
|
[ Log in to reply ] |
|
Chris Wade |
Message #106766, posted by cakewalker at 18:25, 16/3/2008, in reply to message #106748 |
Member
Posts: 10
|
<div style="position:absolute; top:0"> < img width="400" height="100" src="tag.png" alt="" /> </div> Think that should be "top: 0px;" otherwise it won't work on Firefox (and probably the majority of browsers that do things correctly). |
|
[ Log in to reply ] |
|
Jason Togneri |
Message #106769, posted by filecore at 19:03, 16/3/2008, in reply to message #106756 |
Posts: 3868
|
You might want to consider setting sensible colours (or not setting any colours at all) in the <body> tag so that the page degrades gracefully for non-CSS browsers. There are non- CSS-capable browsers? |
|
[ Log in to reply ] |
|
Chris Wade |
Message #106770, posted by cakewalker at 21:52, 16/3/2008, in reply to message #106769 |
Member
Posts: 10
|
You might want to consider setting sensible colours (or not setting any colours at all) in the <body> tag so that the page degrades gracefully for non-CSS browsers. There are non- CSS-capable browsers? IE6, IE5, IE4... ;-) |
|
[ Log in to reply ] |
|
Matthew Somerville |
Message #106817, posted by Matthew at 23:09, 19/3/2008, in reply to message #106766 |
Posts: 520
|
Think that should be "top: 0px;" otherwise it won't work on Firefox (and probably the majority of browsers that do things correctly). No, 0 does not need a unit - "After a zero length, the unit identifier is optional." |
|
[ Log in to reply ] |
|
Richard Goodwin |
Message #106827, posted by rich at 13:15, 20/3/2008, in reply to message #106769 |
Dictator for life
Posts: 6828
|
You might want to consider setting sensible colours (or not setting any colours at all) in the <body> tag so that the page degrades gracefully for non-CSS browsers. There are non- CSS-capable browsers? Lynx? ________ Cheers, Rich.
|
|
[ Log in to reply ] |
|
|