DStereo

Я смог воспроизвести вашу проблему только в ie8, но тем не менее предлагаю вариант разметки, чтобы ничего никуда не лезло во всех браузерах. <div id="main"> <div class="main-wrapper"> <div id="cont"> <p>Ассоциация изоморфна времени. Исчисление предикатов, конечно, дискредитирует принцип восприятия, однако Зигварт считал критерием истинности необходимость и общезначимость, для которых нет никакой опоры в объективном мире. Закон внешнего мира, по определению, ментально индуцирует из ряда вон выходящий закон внешнего мира, изменяя привычную реальность. Отношение к современности реально подрывает напряженный конфликт, учитывая опасность, которую представляли собой писания Дюринга для не окрепшего еще немецкого рабочего движения.</p> <table> <caption><strong>Таблица пошла вниз на ровне со статистикой</strong></caption> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> <tr><td>текст</td><td valign='top'><p>Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац Абзац</p></td></tr> </table> </div> </div> <div class="col-left"> <div id="left"> <p class="b_menu">Новинки</p> </div> <div id="statistic"> <p class="b_menu">Статистика</p> </div> </div> <div id="right"> <p class="b_menu">Каталог</p> </div> </div> Соответственно css для новых элементов и немного измененные некоторые стили для уже существующих. .main-wrapper{float:left;width:100%} .left-col{float:left;width:240px;height:600px;margin-left:-100%} #right{float:left;margin-left:-240px} Для #left и #statistic можно удалить свойства float:left так как они находятся в блоке .col-left, которому уже присвоено float:left.

Покажите пожалуйста код таблицы вместе с тектом. Возможно текст в таблице ее рапирает и она естественно не помещается. Пока что не удается воспроизвести вашу проблему.

Вставил таблицу в центральный div <div id="cont"> <p>Test</p> <table> <tr> <td>Test</td> <td>Test</td> <td>Test</td> <td>Test</td> </tr> </table> </div> пока ничего никуда не уехало. Возможно есть какие-то особые условия? Браузер в котором таблица слазит, стили для таблицы какие-то определенные?

html код еще добавьте, чтобы было понятно, как у вас эти блоки расположены.

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

Как правило не обязятельно делать отдельные стили для ie, просто в ie все будет меньше на пару пикселей, если верстать в em. Так что особой разницы вы не заметите.

В em'ах все браузеры округляют до трех цифер, например 13px - это .813em от стандартных 16, в то время как ie (7-9) округляет до .81em так что в ie ширина даже меньше получится, чем в других браузерах.

Пожалуйста.

Нужно прописать для блока .music: .music{ background:#fff; box-shadow:0 0 10px rgba(0,0,0,0.5); width:600px; height:40px; margin-left:-300px; position:fixed; left:50%; }

Возможно эта - oocss ?

<ul class="menu"> <li> Item 1 <ul class="submenu"> <li>Subitem 1</li> <li>Subitem 2</li> <li>Subitem 3</li> <li>Subitem 4</li> <li>Subitem 5</li> </ul> </li> <li>Item 2</li> <li>Item 3</li> <li>Item 4</li> <li>Item 5</li> </ul> .menu li{border:1px solid #000;float:left;height:20px;position:relative} .submenu{width:500px;position:absolute;top:100%;left:100%} К сожалению придется задавать фиксированную ширину для подменю (она может быть любой, главное чтобы была больше, чем суммарная ширина всех элементов подменю), иначе пункты подменю не будут выстраиваться горизонтально.

Так как внутренний блок находится по z оси выше, чем внешний, то он перекрывает внешний. Можно добавить overflow:hidden для внешнего или background:transparent для внутреннего. Или как сказал Softlink - скруглять углы и для внутреннего блока, так же как и для внешнего.

А почему бы вам не использовать top:-54px раз уж position:relative?

Уточните пожалуйста, как это ниже и на одном уровне?

Можно использовать таблицу: <table> <tr> <td>Логин:</td><td><input></td> </tr> <tr> <td>Пароль:</td><td><input></td> </tr> <tr> <td>Повторите пароль:</td><td><input></td> </tr> </table> Либо можно обернуть все это в дивы: <div> <div>Логин:</div><div><input></div> </div> <div> <div>Пароль:</div><div><input></div> </div> <div> <div>Повторите пароль:</div><div><input></div> </div> Но дивы с логин/пароль/повторите пароль - сделать одинаковой ширины.

Див всегда будет прижиматься к левой стороне окна браузера - это стандартное поведение для всех браузеров. Даже если вы выровняете этот див при помощи position:absolute, то он просто будет обрезаться с левой стороны.

А как дела тогда обстоят с глобальными модификаторами? Они тогда тоже должны идти по коду позже чем описание блока или для них прописывается !important? И еще, допустим есть множество блоков абсолютно разных и у них разные стили, но есть правило одинаковое для всех, например, float:left, то как быть, вынести это правило в отдельный глобальный модификатор и потом каждому блоку в html добавлять класс этого модификатора или оставить как есть, в css в описании каждого блока писать float:left. Что будет эффективней?