cell width

[thefarm]

I have a 2 column table. The table width is set to 100%; the first cell 30% and the second cell 70%. (I have played around with pixels as well.) I cannot seem to make the first (leftmost) cell as small as I would like. It remains large enough that it takes up the entire width of the page! I actually have to scroll over to see the next column/cell, even with text in the second cell. Any ideas as to why my first cell is taking up so much seemingly empty space?

 

[thefarm]

ok, I've just noticed that the 2nd cell seems to want to line up with the end of the horizontal line in the previous row. What's up with that?

 

[thefarm]

oops! The horizontal line is actually a graphic. But I still don't understand why the cells below won't line up the way I want them to.

 

[Kjonnnn]

1. Make sure since you're using percentages that the cells percentages jive with the table percentages.

2. Also check your cell padding properties.

 

[webpager]

Might be worth making the cell widths the required number of pixels, this also means the page is displayed in the correct proportions at all screen resolutions.

 

[thefarm]

Thanks, you guys! I've gotten the cells straightened out somehow. I've got some nested tables; the widths must not have been jiving. Now...I need to make table with rounded corners. Any ideas? Thanks for your help!

 

[UKRacer]

The only way I've found to make rounded corners is to do it by creating eight tiny graphics, and putting them round the edges of a 3x3 table.

topleft, topcentre, topright,
middleleft, middleright,
bottomleft, bottomcentre, bottomright.

* Make sure that the height and width of each corner graphic match, and that the height of the top and bottom graphics, and the width of the left and right graphics also match accordingly.

Make the cell properties as follows:

topleft: width=1%, height=1%
topcentre: width=98%, height=1%
topright: width=1%, height=1%
middleleft: width=1%, height=undefined
middlecentre: width=98%, height=undefined
middleright: width=1%, height=undefined
bottomleft: width=1%, height=1%
bottomcentre: width=98%, height=1%
bottomright: width=1%, height=1%

Put your content in the middlecentre cell.

Put your graphics in the correct cells around the edges, and make the background properties of the topcentre, middle left, middleright, and bottomcentre cells also to be the graphics that are in the same cells respectively.

Make the table properties to be borderwidth=0, and cellpadding=0 and cellspacing=0. Table width can be whatever you want, but the height should be undefined (unless you want the height to be larger than the amount of text in the middle centre cell for some reason - leaving it undefined will allow the table to stretch vertically depending on the amount of text in the centre cell).

Have fun!

Pete