Menu
I am using table-cell arrangement of div blocks in my code. There is a problem in my code.
Preview of how my html looks is here
When I have any content (text or image) in my first panel then the .inner div of the second and third panel have a top margin of some 10-15 pixels. Why is that ?
Can any one look and let me know what I am missing.
681
Adjusting the Margin Size of an HTML Element With CSS You can remove this margin by setting the top and left margin to zero. Like the padding and border, the sizes of specific sides of the margin can be set using margin-left , margin-right , margin-top , and margin-bottom .
To prevent cells (rows) from expanding vertically, you have to set a fixed height for table rows. Select the relevant rows and, on the Table Tools Layout tab, click Properties. On the Row tab, select "Specify height" and then choose "Exactly" for "Row height is." Specify the desired amount.
Each cell in a Word Table has its own margins and like a page, those margins have defaults. The top/bottom are 0 and left/right are 0.19 cm. If you want to change the margins of your table cells, you can do it for the whole table or just for a single row/column/cell.
In traditional HTML coding you remove the spacing within a cell by setting the “cellspacing” attribute to zero.
add vertical-align:top; in #wrapper > div
See Demo: http://jsbin.com/avozik/14/edit
76
I have a similar case, and vertical-align:top; solves the issue. However I want to elaborate reason behind this:
https://jsfiddle.net/46tyc48y/1/
Because table cells uses vertical-align:baseline; by default, the right cell text will align to the baseline(bottom) of the image, creating the phantom spacing on the top. So we need to explicitly set vertical-align to bypass this behavior.
45
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
