Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations Chris Miller on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Is this Table behaviour normal?

Status
Not open for further replies.
may1hem

may1hem

Programmer
Jul 28, 2002
262
GB
I wanted to find out how the BBC News site lays out the images in the content. The text that comes after the image tag in the source code actually appears before the image when viewed in a browser. Is this normal? Here is the source snippet:

----------------------
<table cellspacing=&quot;0&quot; align=&quot;right&quot; border=&quot;0&quot; width=&quot;203&quot; cellpadding=&quot;0&quot;>
<tr><td>
<img height=&quot;152&quot; hspace=&quot;0&quot; vspace=&quot;0&quot; border=&quot;0&quot; width=&quot;203&quot; alt=&quot;UK tank in Iraq AP&quot; src=&quot; />
</td></tr>
</table>

It says there is no cause for alarm, but urges precautions and regular monitoring.
----------------------

I would have thought that the way to produce this sort of result would be to have 2 rows in a table, having the text &quot;It says there is no cause for alarm&quot; in the first <TD> tag and then have the image in a second <TD> tag.

Any thoughts on this?

Thanks,
May
 
Sort by date Sort by votes
Rick, this happens with all of the articles on the BBC News site, though the code snippet that I have pasted above is all that you should need as it is that portion that lays the page out as I described.

If you dump the above code between the <body> tags of a blank page then you'll see what i mean.

May
 
Upvote 0 Downvote
It happens because of the
Code: 
align=&quot;right&quot;
attribute of the <table> tag. What it does is fix the vertical position of the table but set the horizontal position as the right hand side of the screen. Subsequent text will start from that same vertical position and flow around the table. If you resize your browser narrowly enough you'll see that text run down the left hand side of the image and then use the full width of the line below it. A two column table would preserve the gap below the image.

You can get the same effect in CSS by using the
Code: 
float
property. -- Chris Hunt
Extra Connections Ltd
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

bdwilcox
  • Locked
  • Question
More efficient / manageable way to code this HTA w/ VBScript?
Replies
0
Views
713
bdwilcox
bdwilcox
PeDa
  • Locked
  • Question
Display table td's as block element on mobile phone 1
Replies
3
Views
901
spamjim
spamjim
tyutghf
  • Locked
  • Question
Achieving this grid layout in css
Replies
1
Views
206
tyutghf
tyutghf
ashokkumary
  • Locked
  • Question
missing leading zero when we download in excel from html table data.
Replies
1
Views
163
spamjim
spamjim
PeDa
  • Locked
  • Question
Table not formatted correctly in all browsers 1
Replies
2
Views
168
PeDa
PeDa

Part and Inventory Search

Sponsor

Back
Top