user2589161
user2589161

Reputation: 38

Why does table overlap border of parent div element?

In the following example - http://jsfiddle.net/v4CdY/2/ the table crosses bottom border of the parent div element. This happens when the table has align="left" attribute. If you remove this attribute the table will be properly nested inside of the div element. Why?

<div style="border: 1px solid; padding: 8px 16px;">
  <table align="left" border="1" cellpadding="1" cellspacing="1" style="border-collapse: collapse;">

Upvotes: 1

Views: 376

Answers (1)

DarkAjax
DarkAjax

Reputation: 16223

That's because by default the align="left" adds float: left; to the table, if you add float: none; to the table or use table { text-align: left; } instead of the align attribute you'll have no such problem...

JSFiddle Demo

Upvotes: 1

Related Questions