Изменение размера таблицы, содержащей изображения, вызывает огромные белые области - PullRequest
Новая
       25

Изменение размера таблицы, содержащей изображения, вызывает огромные белые области

0 голосов
/ 08 мая 2011

У меня огромная проблема с таблицей. Я создаю страницу с изображениями в таблице.Но если я изменю размер веб-страницы, то вся таблица выходит за пределы экрана и, таким образом, появляется большая белая область.

Я перепробовал все глупости.Ничего не работаетПереполнение: скрытое НЕ работает.Scrollbar = "нет" либо.Проценты не работают.Так или иначе, вот код для таблицы и ниже, CSS. 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Notable Travels</title>
<style type="text/css">
.bg{
position: absolute;
top:0px;
left:0px;
width:100%;
height:100%;
z-index:0;
}

table {
  border-spacing: 10px;
  border-width: 5px;
  border-style: solid;
  border-color: #888;
}


#content {
  margin: 0 auto;
  z-index: 2;
  color: #000;
  text-align: center;
  font-family: 'Times New Roman';
  font-size: 24px;
  font-weight: bolder;
  text-decoration: blink;
}

td, th {
  border-spacing: 10px;
  border-width: thin;
  border-style: solid;
  border-color: #111;
  vertical-align: middle;
}

.tableimg {
  margin: 0 auto;
  width: 450px;
  height: 100px;
}


</style>
</head>

<body>

<table id="content">
  <tr>
    <th>Virtually travelling, some of the 1s ORed/ANDed with mines.</th>
  </tr>
  <tr>
    <td><a href="http://www.soporaeternus.de"><img src="_images/Sopor.jpg" class="tableimg" /></a></td>
  </tr>
  <tr>
    <td><a href="http://www.mensa-romania.ro"><img src"_images/Mensa.jpg" class="tableimg" /></a></td>
  </tr>
  <tr>
    <td><a href="http://www.chess.com"><img src="_images/Chess.jpg" class="tableimg" /></a></td>
  </tr>
</table>


<img src="_images/Links.jpg" border="0"  class="bg"/>
</body>
</html>

Я редактировал его.

1 Ответ

0 голосов
/ 08 мая 2011

Пожалуйста, скажите, пожалуйста, что вы не пытаетесь использовать таблицы для оформления всей веб-страницы. Во всяком случае, я думаю, это то, что вы хотите: 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>Notable Travels</title>
  <style type="text/css">
    html {
      min-width: 100%;
      min-height: 100%;
      background-image: url(_images/Links.jpg);
      background-repeat: no-repeat;
    }

    table {
      border-spacing: 10px;
      border-width: 5px;
      border-style: solid;
      border-color: #888;
      background-color: #FFF;
    }

    #content {
      margin: 0 auto;
      color: #000;
      text-align: center;
      font-family: 'Times New Roman';
      font-size: 24px;
      font-weight: bolder;
      text-decoration: blink;
    }

    td, th {
      border-spacing: 10px;
      border-width: thin;
      border-style: solid;
      border-color: #111;
      vertical-align: middle;
    }

   .tableimg {
      margin: 0 auto;
      width: 450px;
      height: 100px;
    }
  </style>
</head>
<body>
  <table id="content">
    <tr>
      <th>Virtually travelling, some of the 1s ORed/ANDed with mines.</th>
    </tr>
    <tr>
      <td><a href="http://www.soporaeternus.de"><img src="_images/Sopor.jpg" class="tableimg" /></a></td>
    </tr>
    <tr>
      <td><a href="http://www.mensa-romania.ro"><img src="_images/Mensa.jpg" class="tableimg" /></a></td>
    </tr>
    <tr>
      <td><a href="http://www.chess.com"><img src="_images/Chess.jpg" class="tableimg" /></a></td>
    </tr>
  </table>
</body>
</html>
...