By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
448,502 Members | 1,186 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 448,502 IT Pros & Developers. It's quick & easy.

Floating table row

P: n/a
Here's an example of what I'm trying to do:

<table>
<tr style="text-align:left; font-size:10pt; font-weight:bold">
<!-- I want this word to align to the left -->
' ||CRPT|| '
<!-- I want this link to align to the right -->
<A HREF=" REPORT?v_rpt='|| v_rpt
||'&v_printable=1'||'">Printable</A>
</tr>
</table>

I thought that the first row would be aligned left, and the second row
would float on top of it to the right.

Instead, there are two rows aligned to the left. Now, I'm wondering if
using "float" is the way to go about this.
Dec 6 '07 #1
Share this Question
Share on Google+
7 Replies


P: n/a
On Dec 6, 1:06 pm, Allie <arcrev...@gmail.comwrote:
Here's an example of what I'm trying to do:

<table>
<tr style="text-align:left; font-size:10pt; font-weight:bold">
<!-- I want this word to align to the left -->
' ||CRPT|| '
<!-- I want this link to align to the right -->
<A HREF=" REPORT?v_rpt='|| v_rpt
||'&v_printable=1'||'">Printable</A>
</tr>
</table>

I thought that the first row would be aligned left, and the second row
would float on top of it to the right.

Instead, there are two rows aligned to the left. Now, I'm wondering if
using "float" is the way to go about this.
whoops, "float: right;" goes right before the "text-align: left;"
above. That's what I meant to put in the first post.

Dec 6 '07 #2

P: n/a
Allie wrote:
Here's an example of what I'm trying to do:

<table>
<tr style="text-align:left; font-size:10pt; font-weight:bold">
<!-- I want this word to align to the left -->
' ||CRPT|| '
<!-- I want this link to align to the right -->
<A HREF=" REPORT?v_rpt='|| v_rpt
||'&v_printable=1'||'">Printable</A>
</tr>
</table>

I thought that the first row would be aligned left, and the second row
would float on top of it to the right.
1. Where do you see two rows? You have only one.

2. A TR can't contain text. It can only contain TDs and THs.
Dec 6 '07 #3

P: n/a
On Dec 6, 1:25 pm, Harlan Messinger
<hmessinger.removet...@comcast.netwrote:
Allie wrote:
Here's an example of what I'm trying to do:
<table>
<tr style="text-align:left; font-size:10pt; font-weight:bold">
<!-- I want this word to align to the left -->
' ||CRPT|| '
<!-- I want this link to align to the right -->
<A HREF=" REPORT?v_rpt='|| v_rpt
||'&v_printable=1'||'">Printable</A>
</tr>
</table>
I thought that the first row would be aligned left, and the second row
would float on top of it to the right.

1. Where do you see two rows? You have only one.

2. A TR can't contain text. It can only contain TDs and THs.
okay. sorry for the confusion. here we go:
<tr>
<p align="left">
' ||CRPT|| '
</p>
</tr>
<tr>
<p style="float:right>
&nbsp;<A HREF=" REPORT?v_rpt='|| v_rpt
||'&v_printable=1'||'">Printable</A>
</p>
</tr>
Dec 6 '07 #4

P: n/a
Allie wrote:
On Dec 6, 1:25 pm, Harlan Messinger
<hmessinger.removet...@comcast.netwrote:
>Allie wrote:
>>Here's an example of what I'm trying to do:
<table>
<tr style="text-align:left; font-size:10pt; font-weight:bold">
<!-- I want this word to align to the left -->
' ||CRPT|| '
<!-- I want this link to align to the right -->
<A HREF=" REPORT?v_rpt='|| v_rpt
||'&v_printable=1'||'">Printable</A>
</tr>
</table>
I thought that the first row would be aligned left, and the second row
would float on top of it to the right.
1. Where do you see two rows? You have only one.

2. A TR can't contain text. It can only contain TDs and THs.

okay. sorry for the confusion. here we go:
<tr>
<p align="left">
' ||CRPT|| '
</p>
</tr>
<tr>
<p style="float:right>
&nbsp;<A HREF=" REPORT?v_rpt='|| v_rpt
||'&v_printable=1'||'">Printable</A>
</p>
</tr>
Still no TDs.

Why are you using the HTML align attribute in one place and a float in
the other? The CSS attribute for text alignment is text-align.
Dec 6 '07 #5

P: n/a
On 6 déc, 18:54, Allie <arcrev...@gmail.comwrote:
someone told me that what I wanted
to do to solve my problem was use float to the right and align to the
left.
If you read carefully the CSS 2.x specification, you'll see that
floating a
table row is either formally discouraged or its effect can not be
defined.
That's all I was able to get from him. I created this message to
hopefully get some help, because I have very little html experience.
Anyway, after messing around with it, i think that I'll just use 2
different rows.
Chances are you are misusing tables for layout purposes anyway.
Tables
should be used for tabular data only, not for positioning content.

CSS page templates:
http://www.gtalbot.org/NvuSection/Nv...bpageTemplates

Table-based webpage design versus CSS-based webpage design: resources,
explanations and tutorials:
http://www.gtalbot.org/NvuSection/Nv...CSSDesign.html

Gérard
Dec 8 '07 #6

P: n/a
On 2007-12-08, GTalbot <ne*******@gtalbot.orgwrote:
On 6 déc, 18:54, Allie <arcrev...@gmail.comwrote:
>someone told me that what I wanted
to do to solve my problem was use float to the right and align to the
left.

If you read carefully the CSS 2.x specification, you'll see that
floating a
table row is either formally discouraged or its effect can not be
defined.
I think it is well-defined, it's just not quite what people expect.

If you float a table row, it becomes a block (see CSS 2.1 9.7). That
means you have a block directly inside a table, and table cells directly
inside a block, both of which result in the generation of anonymous
table boxes (see CSS 2.1 17.2.1).

So if you started with this:

table
row
cell cell
row
cell cell

and you float the first row, you should get this:

table
row*
cell*
floated block
table*
row*
cell cell
row
cell cell

Where * denotes an anonymous table, table-row or table-cell box.

In most cases the result will actually look very similar anyway. And
you're right it's not recommended.

There is a Note at the bottom of CSS 2.1:

C.3.29 17.5 Visual layout of table contents

The following note:

Note. Table cells may be relatively and absolutely positioned,
but this is not recommended: positioning and floating remove a
box from the flow, affecting table alignment.

has been amended as follows:

Note. Table cells may be positioned, but this is not
recommended: absolute and fixed positioning, as well as
floating, remove a box from the flow, affecting table size.

The amendment of course is to remove relative positioning, which is
harmless and quite useful to do on a table cell to turn it into a
containing block for positioned contents. Unfortunately that _only_
works in IE, and not in FF, Opera or Konqueror. See
http://www.tidraso.co.uk/misc/td-alignment.html.
Dec 8 '07 #7

P: n/a
Allie schreef:
Here's an example of what I'm trying to do:

<table>
<tr style="text-align:left; font-size:10pt; font-weight:bold">
<!-- I want this word to align to the left -->
' ||CRPT|| '
<!-- I want this link to align to the right -->
<A HREF=" REPORT?v_rpt='|| v_rpt
||'&v_printable=1'||'">Printable</A>
</tr>
</table>

I thought that the first row would be aligned left, and the second row
would float on top of it to the right.

Instead, there are two rows aligned to the left. Now, I'm wondering if
using "float" is the way to go about this.
<!-- I want this link to align to the right -->
<div style="float:right"><A HREF=" REPORT?v_rpt='||
v_rpt||'&v_printable=1'||'">Printable</A></div>
<!-- I want this word to align to the left -->
' ||CRPT|| '

And remove the table. Assign the font settings to the containing element.

--
http://www.roderik.net/nieuws/
Dec 8 '07 #8

This discussion thread is closed

Replies have been disabled for this discussion.