log in | register | forums
Show:
Go:
Forums
Username:

Password:

User accounts
Register new account
Forgot password
Forum stats
List of members
Search the forums

Advanced search
Recent discussions
- AMCS free versions are live! (Gen:13)
- Elesar releases new version of Prophet (News:)
- NetSurf or Iconbar? (Site:2)
- Orpheus launch crowdfunding campaign (News:4)
- RISC OS ports website (News:3)
- July News round-up (News:)
- State of RISC OS software (Gen:5)
- Lua and RISC OS (Prog:1)
- RiscOSM continues to expand its horizons (News:1)
- Font Directory Pro moves to 3.23 (News:)
Latest postings RSS Feeds
RSS 2.0 | 1.0 | 0.9
Atom 0.3
Misc RDF | CDF
Site Search
 
Article archives
The Icon Bar: Programming: Align to bottom of table cell.
 
  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
ad

Posts: 3229
<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
ad

Posts: 3229
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: 3867
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
ad

Posts: 3229
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
monkeyson2Please 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: 5552
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: 9346
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: 3867
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
VincceH
Lowering the tone since the dawn of time

Posts: 1591
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: 3867
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
Matthew

Posts: 519
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
Rich
Webmaster
The Icon Bar

Posts: 6780
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? tongue
________
RichGCheers,
Rich.
  ^[ Log in to reply ]
 

The Icon Bar: Programming: Align to bottom of table cell.