dongna Posted December 5, 2008 Share Posted December 5, 2008 Whenever I use a <p> within a table cell, I get undesirable white space at the top of the cell. This can be seen hereWhat is the proper approach to eliminate this? Link to comment Share on other sites More sharing options...
jeffman Posted December 5, 2008 Share Posted December 5, 2008 Use CSS. First, zero your <p> elements. You never know when a browser is going to add some. Also change the vertical align in your table cells. p { margin: 0; padding: 0;}td { vertical-align: top;} Obviously, if you need to add margin or padding to any classes of <p> elements, you're still free to do so. Link to comment Share on other sites More sharing options...
dongna Posted December 5, 2008 Author Share Posted December 5, 2008 Thank you, that works well.Of course it also affects <p>'s outside of tables. What is the proper way to zero my <p> elements only within certain tables?Also, in order to get whitespace between <p>'s within my table cell, I assume I have to "double-space", i.e. put <p> </p> in between actual paragraphs containing text? Link to comment Share on other sites More sharing options...
Ingolme Posted December 5, 2008 Share Posted December 5, 2008 I never recommend adding extra content to style your pages.Just put margin only for <p> elements in your table cell: td p { margin: 1em 0; } Link to comment Share on other sites More sharing options...
dongna Posted December 5, 2008 Author Share Posted December 5, 2008 I am still unclear how to apply this formatting only to certain tables. I understand how to use classes, for example p.classname or table.classname, but not in this combination case where I have td p (I'm new to using CSS for formatting tables).What I want is to assign a class to a table and have that table with no whitespace around the <p>'s. Link to comment Share on other sites More sharing options...
Ingolme Posted December 5, 2008 Share Posted December 5, 2008 Well, if you apply the classname to a table, you can remove the whitespace only for the table by using classes:This code only assigns the style to any <p> element inside a <table class="mytable"> table.mytable p {margin: 0;padding: 0;} Link to comment Share on other sites More sharing options...
dongna Posted December 6, 2008 Author Share Posted December 6, 2008 That is what I was missing... thank you! Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.