Нежелательный край

Я получаю 2px нежелательные поля/отступы/границы, но не могу для жизни меня видеть, что вызывает его. Он выходит так же как в FF47 и O 36.0.2130.80Нежелательный край

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html lang="en"> 
<head> 
    <style> 
     HEAD,BODY,TABLE,TBODY,TR,TH,TD,DIV { 
      padding:0; 
      margin:0; 
      border:0; 
      } 
     BODY { 
      background-color:#555577; 
      color:#CCCCCC; 
      font-family:"Verdana","Arial","Helvetica"; 
      font-size:9pt; 
      text-decoration:none; 
      border:0; 
      padding:0; 
      margin:auto ; 
      } 
    </style> 
    </head> 
    <body> 
     <table width="400" style="background-color:white;margin:auto;padding:0;border:0"> 
      <tr> 
       <td> 
        <table width=200 style="background-color:#780000;color:white;padding;0;border:0;"> 
         <tr> 
          <td>FOO</td> 
         </tr> 
        </table> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>

источник

2016-10-09 MMacD

Вы можете добавить изображение, желаемый результат? – xzegga

Oeff, таблица внутри таблицы .... это так 1999 – LinkinTED

@LinkinTED Я думаю, что это некоторые случаи, когда это все еще имеет смысл. HTML-письма, например. – almo

Добавить

border-spacing: 0px;

К столу.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd"> 
<html lang="en"> 
<head> 
    <style> 
     HEAD,BODY,TABLE,TBODY,TR,TH,TD,DIV { 
      padding:0; 
      margin:0; 
      border:0; 
      border-spacing: 0px; 
      } 

     BODY { 
      background-color:#555577; 
      color:#CCCCCC; 
      font-family:"Verdana","Arial","Helvetica"; 
      font-size:9pt; 
      text-decoration:none; 
      border:0; 
      padding:0; 
      margin:auto ; 
      } 
    </style> 
    </head> 
    <body> 
     <table><tr><td height="50"></td></tr></table> 
     <table width="400" style="background-color:white;margin:auto;padding:0;border:0"> 
      <tr> 
       <td> 
        <table width=200 style="background-color:#780000;color:white;padding;0;border:0;"> 
         <tr> 
          <td>FOO</td> 
         </tr> 
        </table> 
       </td> 
      </tr> 
     </table> 
    </body> 
</html>

https://jsfiddle.net/

источник

2016-10-09 17:51:58 almo

Спасибо, я никогда этого не узнал. Но * border-spacing * ??? Это странно! – MMacD

Вы можете своей цели АРХИВ более чистым и профессиональным использованием дивы вместо таблицы:

BODY { 
 
    background-color:#555577; 
 
} 
 
#progress-containes { 
 
    margin-top: 50px; 
 
    width : 400px; 
 
    height: 30px; 
 
    background-color: #fff; 
 
} 
 
#progress-bar { 
 
    background-color:#780000; 
 
    font: 400 9pt/1 "Verdana","Arial","Helvetica"; 
 
    width: 50%; 
 
    color: #fff; 
 
    padding-top: 8px; 
 
    padding-left: 6px; 
 
    box-sizing: border-box; 
 
    height: 100%; 
 
}

<div id="progress-containes"> 
 
    <div id="progress-bar"> 
 
    FOO 
 
    </div> 
 
</div>

источник

2016-10-09 18:01:21 xzegga

Да, но я старая школа и предпочитаю столы. Страница не перетаскивается так много, пока она отображается. – MMacD

Добавить "border-collapse: collapse;" для табличного элемента, вы можете увидеть ПИК здесь:

источник

2016-10-09 18:01:25

Я ценю ваше решение, Джек, но уже выбрал Альмо. Честно говоря, поскольку нет границ, я не совсем понимаю, как может работать * border-collapse * OR * border-spacing *. Что-то сломалось где-то. – MMacD

Нежелательный край

ответ

Смежные вопросы