Solved

Tables not playing nicely.

Posted on 2011-02-23
2
216 Views
Last Modified: 2012-05-11
Hello,

Please see the attached code for a table. What I'm expecting is when the text is resized, the two middle row of the two outer tables should expand vertically taking up as much space as possible... Can anybody spot anything obvious?

Thanks.
Uni
.FullHeight{
	height:100%;
}

.BoxSize{
	width:20px;
	height:20px;
}

<table>
	<tr>
		<td class="FullHeight">
			<table>
				<tr><td class="BoxSize"><img src="tl.png"/></td></tr>
				<tr><td class="FullHeight"></td></tr>
				<tr><td class="BoxSize"><img src="bl.png"/></td></tr>
			</table>
		</td>
		<td>Test</td>
		<td class="FullHeight">
			<table>
				<tr><td class="BoxSize"><img src="tr.png"/></td></tr>
				<tr><td class="FullHeight"></td></tr>
				<tr><td class="BoxSize"><img src="br.png"/></td></tr>
			</table>
		</td>
	</tr>
</table>

Open in new window

0
Comment
Question by:Unimatrix_001
2 Comments
 
LVL 27

Accepted Solution

by:
Lukasz Chmielewski earned 500 total points
ID: 34964874
For a full height of a child container, the wrapping container should be set also to 100%, begin with body.
0
 
LVL 3

Author Closing Comment

by:Unimatrix_001
ID: 34968246
Thank you! :)
0

Featured Post

Netscaler Common Configuration How To guides

If you use NetScaler you will want to see these guides. The NetScaler How To Guides show administrators how to get NetScaler up and configured by providing instructions for common scenarios and some not so common ones.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Someone recently asked me about how to display a progress indicator on a page while an iframe is loading. And I remember when I first came across this myself. It was a bit tricky to get my head around, but really, it's very simple. The most impor…
Find out what you should include to make the best professional email signature for your organization.
The viewer will the learn the benefit of plain text editors and code an HTML5 based template for use in further tutorials.
Learn how to create flexible layouts using relative units in CSS.  New relative units added in CSS3 include vw(viewports width), vh(viewports height), vmin(minimum of viewports height and width), and vmax (maximum of viewports height and width).

773 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question