[HTML] Keeping text from running up beside a table - Tilted Forum Project Discussion Community

digby · 01-05-2006, 10:35 PM

I'm just starting to learn HTML/CSS, and I'm trying to figure out how to deal with tables that aren't the full width of my document. If I have another <p> section below the table, the first part of the text starts to the side of the top of the aforementioned table whenever I have the table aligned to the left or right.

I made a quick example to show you what I'm talking about.

Is there a way to align my table to one side or the other without the text wrapping around it?

Chamaeleontidae · 01-06-2006, 06:49 AM

Don't putting the alignment in the table tag. Leave the table tag without alignment, and then align the table as you would align text. Here is a link with some good information for you...

Code:

<p align="left">
<table border="1px" width="500">
	<tr>
		<td align="left" width="250"> Cell One</td>
		<td align="left" width="250"> Cell Two</td>
	</tr>
	<tr>
		<td align="left" width="250"> Cell Three</td>
		<td align="left" width="250"> Cell Four</td>
	</tr>
</table>
</p>

digby · 01-06-2006, 08:04 AM

Ah. I had tried the <p> tags around the paragraph, but it didn't work. That link however gave me what I was looking for:

Code:

<div align="right">
<table border="1px" width="500">
	<tr>
		<td align="left" width="250"> Cell One</td>
		<td align="left" width="250"> Cell Two</td>
	</tr>
	<tr>
		<td align="left" width="250"> Cell Three</td>
		<td align="left" width="250"> Cell Four</td>
	</tr>
</table>
</div>

That's what I wanted. Thanks!

A follow-up question: Is that usage of the <div> tag allowed in XHTML, or should I have defined that in CSS?

Chamaeleontidae · 01-06-2006, 09:37 AM

I am not sure if the div tag is ok for XHTML 1.0 Strict Specification. The follow code is happy in the transitional spec...

Code:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
    <title>Untitled Page</title>
</head>
<body>
<p>Hi there</p>
    <div style="text-align: right">
        <table border="1px" width="500" style="">
	        <tr>
		        <td align="left" width="250" style="height: 23px"> Cell One</td>
		        <td align="left" width="250" style="height: 23px"> Cell Two</td>
	        </tr>
	        <tr>
		        <td align="left" width="250" style="height: 23px"> Cell Three</td>
		        <td align="left" width="250" style="height: 23px"> Cell Four</td>
	        </tr>
        </table>
    </div>
<p>How are things going</p>
</body>
</html>

theFez · 01-09-2006, 09:42 PM

div is fine in xhtml, even encouraged.

<edit>oh, now i understand, is adding the alignment parameter allowed. not sure, but i would keep it in the css.</edit>

01-05-2006, 10:35 PM	#1 (permalink)
digby Crazy Location: Ahh, the lovely South	[HTML] Keeping text from running up beside a table I'm just starting to learn HTML/CSS, and I'm trying to figure out how to deal with tables that aren't the full width of my document. If I have another <p> section below the table, the first part of the text starts to the side of the top of the aforementioned table whenever I have the table aligned to the left or right. I made a quick example to show you what I'm talking about. Is there a way to align my table to one side or the other without the text wrapping around it? __________________ mmmm.... pudding

01-06-2006, 06:49 AM	#2 (permalink)
Chamaeleontidae aka: freakylongname Location: South of the Great While North	Don't putting the alignment in the table tag. Leave the table tag without alignment, and then align the table as you would align text. Here is a link with some good information for you... Code: <p align="left"> <table border="1px" width="500"> <tr> <td align="left" width="250"> Cell One</td> <td align="left" width="250"> Cell Two</td> </tr> <tr> <td align="left" width="250"> Cell Three</td> <td align="left" width="250"> Cell Four</td> </tr> </table> </p> __________________ "Reality is just a crutch for people who can't cope with drugs." Robin Williams.

01-06-2006, 08:04 AM	#3 (permalink)
digby Crazy Location: Ahh, the lovely South	Ah. I had tried the <p> tags around the paragraph, but it didn't work. That link however gave me what I was looking for: Code: <div align="right"> <table border="1px" width="500"> <tr> <td align="left" width="250"> Cell One</td> <td align="left" width="250"> Cell Two</td> </tr> <tr> <td align="left" width="250"> Cell Three</td> <td align="left" width="250"> Cell Four</td> </tr> </table> </div> That's what I wanted. Thanks! A follow-up question: Is that usage of the <div> tag allowed in XHTML, or should I have defined that in CSS? __________________ mmmm.... pudding Last edited by digby; 01-06-2006 at 08:07 AM..

01-09-2006, 09:42 PM	#5 (permalink)
theFez Crazy Location: here and there	div is fine in xhtml, even encouraged. <edit>oh, now i understand, is adding the alignment parameter allowed. not sure, but i would keep it in the css.</edit> __________________ # chmod 111 /bin/Laden