Форум программистов [Powered by Invision Power Board]

Версия для печати темы
Нажмите сюда для просмотра этой темы в оригинальном формате

Форум программистов > Вёрстка веб-сайтов > Переделать table в div

Автор: Atlete 7.7.2008, 11:26

есть верстака с использованием table
код следующий:

Код


<table align="center">
<tr>
<td>part_left</td>
<td>CENTER</td>
<td>part_right</td>
</tr>
</table>

вся эта таблица выодится в центре браузера.
При изменении размера таблица остается в центре
Как повторить подобное только использовать div.

Автор: bars80080 7.7.2008, 11:48

Код


<style>
body { text-align: center; }
#qw { margin-left: auto; margin-right: auto; }
</style>
<body>
<div id="qw">
<span>part_left</span>
<span>CENTER</span>
<span>part_right</span>
</div>
</body>

Автор: Atlete 7.7.2008, 12:14

Спасибо за ответ, но а если в данную струкутру будут вноситься вложенные div для вывода данных

в таблицах это выглядело так:

Код


<table align="center">
<tr>
<td>
   <table style="width:100px;">
     <tr>
       <td> some data left</td>
     </tr>
   </table>
</td>
<td>
   <table style="width:300px;">
     <tr>
       <td> data in center</td>
     </tr>
     <tr>
       <td> data in center</td>
     </tr>
     <tr>
       <td> data in center</td>
     </tr>
   </table>
</td>
<td>
   <table style="width:200px;">
     <tr>
       <td> some data right</td>
     </tr>
   </table>
</td>
</tr>
</table>

также неопходимо чтобы можно ыбло задать ширину столбцов.

Автор: bars80080 7.7.2008, 12:45

да задавай, кто мешает?

нужны вложенные блоки? вкладывай. если нужны вертикальные друг под другом - испльзуй div, если линейные слева направо - span, ширину также можно указать, как и в таблице

Автор: Atlete 7.7.2008, 14:31

Напсиал следующий код

Код


<style>
body { text-align: center; }
#qw { margin-left: auto; margin-right: auto; }
</style>
<body>
<div id="qw">
<span>
    <div>som code</div>
</span>
<span>
    <div>
        <span>11111</span>
        <span>22222</span>
        <span>33333</span>
    </div>
</span>
<span>part_right</span>
</div>
</body>

Вывод в брузер:

som code
11111 22222 33333
part_right

а мне нужно чтобы было так:

som code 11111 22222 33333 part_right

но с вложенными дивами. Что нужно изменить?

Автор: bars80080 7.7.2008, 14:38

а зачем в таком случае div'ы, которые и вызывают перевод строки?

Код


<style>
body { text-align: center; }
#qw { margin-left: auto; margin-right: auto; }
</style>
<body>
<div id="qw">
<span>
    som code
</span>
<span>
    
        <span>11111</span>
        <span>22222</span>
        <span>33333</span>
    
</span>
<span>part_right</span>
</div>
</body>

Добавлено через 39 секунд
зачем дивы?, чем спаны хуже их?

Автор: WebDisaster 7.7.2008, 14:38

Цитата(Atlete @ 7.7.2008, 14:31

)

Atlete, вкладывать блочные элементы внутрь строчных -- дурной тон =)

Автор: Atlete 7.7.2008, 22:57

Понятно....сказывается верстка таблицами.
Спасибо всем за разъяснение.

Ну а если необходимл сделать вложенную таблицу, то как это реализовать?

Автор: bars80080 8.7.2008, 09:38

засовываешь таблицу внутрь блока, ничего более конкретно на такой общий вопрос ответить нельзя