2014-01-06 2 views
1

Когда я показываю ему следующую таблицу, между таблицей и div есть зазор. Я хотел бы знать причину.Почему существует разрыв между таблицей и div с правой стороны?

jsFiddle

<!DOCTYPE html> 
<html> 
    <style> 
    table { 
     border-collapse:collapse; 
    } 
    table,td { 
     border:1px solid black; 
     text-align:center; 
    } 
    </style> 
    <body> 
    <div style="width:150px;border:1px solid black;"> 
     <table style="width:100%;"> 
     <tr> 
      <td>value 
      </td> 
     </tr> 
     </table> 
    </div> 
    </body> 
</html> 
+0

я думаю, что вы имеете в виду разрыв между браузером края и ваш DIV в этом случае ниже ответ добавить 'Маржа & обивка: 0' является правильным, вы должны изменить этот вопрос, поскольку это не исправить разрыв не находится между вашим div и столом, но краем браузера и вашим div. – Nishant

ответ

0

Это кажется работать нормально http://jsfiddle.net/Db7Th/

Если вам не нравится, как граница толще, чем вы, возможно, хотите, я просто удалил границу из DIV

div { width: 150px; } 

http://jsfiddle.net/Db7Th/1/

+0

Кажется, проблема из http://www.w3schools.com/ editor. – user2067036

4

Браузер по умолчанию применяется margin и padding к элементам, так что вам нужно сбросить их ..

* { 
    margin: 0; 
    padding: 0; 
} 

Demo

Или вы можете также использовать body

body { 
    padding: 0; 
    margin: 0; 
} 

Demo

Примечание: Я использую * селектор, который будет применять свойства всех элементов, поэтому, если вы хотите, чтобы целевые элементы конкретно, чем рассмотреть возможность использования class или id вместо

1

"существует разрыв между столом и DIV"

Это не между table и div, его между div и браузер кадров

Вы можете управлять им, используя margin. установить margin в 0

body{ 
    margin: 0; 
} 
Смежные вопросы