XHtml Strict, Float: Центр? - PullRequest
       18

XHtml Strict, Float: Центр?

1 голос
/ 06 апреля 2010

У меня проблемы с Xhtml Strict 1.0 и Css. И у меня почти нет решений.

URL моего сайта: http://www.pro -turk.net / beta /

Я создал многоуровневое раскрывающееся меню jquery для своего сайта.

Это выглядит как ОК, но я использовал свойство inline-block атрибута css display в меню навигации, которое является частью css 2.1 и не поддерживается некоторыми браузерами (включая ie6 и ie7).

Я хочу, чтобы элементы #nav> li блокировали элементы уровня, но чтобы сделать это и разместить их все в одной строке, единственный способ - использовать float в #nav> li. Но я хочу расположить их по центру их родителей (строка меню). Поэтому мне нужно что-то вроде float: center (я знаю, что это довольно глупо и не существует). Но есть ли способ включить элементы уровня блока как дочерние элементы без разрывов строки (я имею в виду, не делая элемент уровня блока).

Привет.

Ответы [ 3 ]

0 голосов
/ 06 апреля 2010

Я думаю, что нет решения для этого в css2 без использования таблиц.

0 голосов
/ 06 апреля 2010

display: inline-block не поддерживается в IE6 или IE7, но вы можете получить тот же эффект в этих браузерах, используя display: inline и убедившись, что hasLayout установлен для этих элементов, скажем, используя zoom: 1. Используйте условные комментарии, чтобы направлять разные CSS только в эти браузеры.

0 голосов
/ 06 апреля 2010

Вы можете заставить li плавать влево или вправо и сделать само меню центрированным.Сделайте меню шириной суммы его элементов.

#nav
{
    width: 500px;

    /* This will center the block within its container */
    margin-left: auto;
    margin-right: auto;
}

РЕДАКТИРОВАТЬ: Поскольку вы не знаете ширину меню (оно динамическое), мы подходим к тому самому случаю, когда нетальтернатива таблицам.

<table border="0" cellpadding="0" cellspacing="0" style="margin: 0 auto;">
    <tr>
        <td>Menu item 1</td>
        <td>Menu item 2</td>
        <td>Menu item 3</td>
    <tr>
<table>

PS Существует некоторая замена таблицам с более новыми расширениями CSS3, такими как display:table | table-cell и т. д., но пока еще не имеет широкой поддержки.

...