Re[2]: Таблица и DIV с одной шириной - Веб программирование

Салют, всем!

Простой пример (X)HTML с CSS. Хочу разметить таблицу и DIV тэг с одной шириной, но в < FF 3.0 и < IE 7.0 почему-то получается разная ширина для первого примера (second sample). Тестирую ширину так же на увеличение текста (Ctrl ++).

Кто-нибудь знает решение?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
    "http://www.w3.org/TR/xhtml1/DTD/transitional.dtd">
<html xmlns="http://www.w3.org/TR/xhtml1">
<head>
<title>Test table and DIV tag width</title>
<style>
* {
    margin : 0;
    padding: 0;
}
</style>
</head>
<body>
    <h2>First sample:</h2>
    <table style="width: 50%; border: 1px solid;">
        <tr>
            <td>text</td>
            <td>text</td>
        </tr>
        <tr>
            <td>aaaa</td>
            <td>bbbb</td>
        </tr>
    </table>
    
    <div style="border: 1px solid #7090C0; width: 50%;">
        <A href="#">Next</A></div> 
    
    <br /><br />
    <h2>Second sample:</h2>
    <table style="width: 50.18%; border: 1px solid;">
        <tr>
            <td>text</td>
            <td>text</td>
        </tr>
        <tr>
            <td>aaaa</td>
            <td>bbbb</td>
        </tr>
    </table>
    
    <div style="border: 1px solid #7090C0; width: 50%; margin-top: 0px;">
        <A href="#">Next</A></div>     
</body>
</html>

Здравствуйте, russl, Вы писали:

R>Салют, всем!

R>Простой пример (X)HTML с CSS. Хочу разметить таблицу и DIV тэг с одной шириной, но в < FF 3.0 и < IE 7.0 почему-то получается разная ширина для первого примера (second sample). Тестирую ширину так же на увеличение текста (Ctrl ++).

Может потому что ширина(свойство width) для таблицы включает толщину границ. То есть в первом примере ширина таблицы есть 50%, а дива 50% + 2 пикселя(суммарная толщина границы слева и справа).

Можно таблицу обрамить в див аналогичный существующему и задать ей ширину 100%:

...
    <h2>First sample:</h2>
    <div style="border: 1px solid #7090C0; width: 50%;">
    <table style="width: 100%; border: 0px solid;">
        <tr>
            <td>text</td>
            <td>text</td>
        </tr>
        <tr>
            <td>aaaa</td>
            <td>bbbb</td>
        </tr>
    </table>
    </div>
    
    <div style="border: 1px solid #7090C0; width: 50%;">
        <A href="#">Next</A></div>
...

Здравствуйте, Аноним, Вы писали:

А>Здравствуйте, russl, Вы писали:

А>Может потому что ширина(свойство width) для таблицы включает толщину границ. То есть в первом примере ширина таблицы есть 50%, а дива 50% + 2 пикселя(суммарная толщина границы слева и справа).

А>Можно таблицу обрамить в див аналогичный существующему и задать ей ширину 100%:

А>

А>...
А>    <h2>First sample:</h2>
А>    <div style="border: 1px solid #7090C0; width: 50%;">
А>    <table style="width: 100%; border: 0px solid;">
А>        <tr>
А>            <td>text</td>
А>            <td>text</td>
А>        </tr>
А>        <tr>
А>            <td>aaaa</td>
А>            <td>bbbb</td>
А>        </tr>
А>    </table>
А>    </div>
    
А>    <div style="border: 1px solid #7090C0; width: 50%;">
А>        <A href="#">Next</A></div>
А>...
А>

В точку!

Спасибо.

	От:	russl
	Дата:	14.07.08 09:22
	Оценка:

	От:	Аноним
	Дата:	14.07.08 10:13
	Оценка:

	От:	russl
	Дата:	14.07.08 12:47
	Оценка: