Jump to content
  • 0

Центрирование ul


ShumNo
 Share

Question

Подскажите, возможно ли оно

Отцентрировать список ul без указания этому списку ширины? ширина меняется

Вообще работает text-align:center; и display:inline;

Но при inline элементы становятся уже не блочными и не работают отступы вверх и вниз у ссылок внутри li

Вот так на пальцах :)

Link to comment
Share on other sites

Recommended Posts

  • 0
Подскажите, возможно ли оно

Отцентрировать список ul без указания этому списку ширины?

Я обычно <li> делаю inline, а отступы задаю непосредственно <ul>.

Если такой вариант не подходит, то делаем display: inline-block, а для IE:

display: inline;
zoom: 1;

Вроде бы должно сработать.

Edited by Serlutin
Link to comment
Share on other sites

  • 0

Инлайн-блок работает хорошо. IE8 его понял, а 7-й провалился 6-й тоже провалится но на него я забил :( Почти забил и на 7-й но пока стараюсь тестировать и его

Clubberry не очень пока хочу показывать :)

display: inline;

zoom: 1;

Зум 1 не помог и с display: inline; опять же получится ли не блочными :)

Link to comment
Share on other sites

  • 0
Инлайн-блок работает хорошо. IE8 его понял, а 7-й провалился 6-й тоже провалится но на него я забил :( Почти забил и на 7-й но пока стараюсь тестировать и его

Clubberry не очень пока хочу показывать :)

display: inline;

zoom: 1;

Зум 1 не помог и с display: inline; опять же получится ли не блочными :(

А зачем тебе нужен этот некчёмный inline-block, вон Scrum padding советует вместо него использовать http://forum.htmlbook.ru/index.php?s=&...st&p=186026 :)

Link to comment
Share on other sites

  • 0
А зачем тебе нужен этот некчёмный inline-block, вон Scrum padding советует вместо него использовать http://forum.htmlbook.ru/index.php?s=&...st&p=186026 :(

Ой чета я не вкурил ту тему, но паддинги это вообще все ради них переделываю :) Раньше паддинг стоял у li а задача была поставить у ссылки, чтобы проще попадать мышкой было. Да без кода не понятно

При блок инлайн у нас центрируется список но нет блочности. При флоате у нас есть блочность но нет центрирования :)

Link to comment
Share on other sites

  • 0
Да с display: inline; в ие работает только display: inline; сделать элементы li не блочными и они потеряют ряд свойств :)

Дружище, кроме шуток. Тебе уже дали решение сверху. Что не так?

Вот это например тебя чем не устраивает? http://serlutin.nxt.ru/example/inline-block.html

Link to comment
Share on other sites

  • 0

Вот пример http://shumno.com/pub/example/exa.html

Все отлично работает кроме 7-го IE

Подскажите куда пнуть этот код :)

Задача чтобы меню было по центру, без ширины

li был блочный

Раньше был inline, но попадать на циферки сложно и сейчас не легко, но полегче благодаря паддингу

Link to comment
Share on other sites

  • 0
А зачем тебе нужен этот некчёмный inline-block, вон Scrum padding советует вместо него использовать http://forum.htmlbook.ru/index.php?s=&...st&p=186026 smile.gif

Не стоит педалировать из-за непонимания и принципов использования. :) Смотри сколько граблей вы собрали inline-block.

Link to comment
Share on other sites

  • 0
Не стоит педалировать из-за непонимания и принципов использования. :) Смотри сколько граблей вы собрали inline-block.

Да в том то и дело, что тут идёт полноое непонимание со стороны ТС, несмотря на то, что ему уже 20 раз всё разжевали и привели решения, все кому не лень. :)

Link to comment
Share on other sites

  • 0

http://serlutin.nxt.ru/example/inline-block.html (если вдруг не обновилось, то нажмите CTRL+R или CTRL+F5)

Вот сделал то, что вам нужно. Работает в IE6.

inline-block офигенная вещь. А HasLayout уже даже хаком не считается, настолько он прочно он вошёл в нашу жизнь.

Link to comment
Share on other sites

  • 0
с флоатом не пашет. с флоатом будет работать только если указать ширину, но ширину я не могу указать она меняется :)

Да вон Scrum сообщил, что флоаты можно выровнять с помощью text-align: center; :)

Link to comment
Share on other sites

  • 0

Ни одних граблей с inline-block в этой теме пока не нашли :). Грабли с ним бывают в двух местах — в FF2 (давно вымершем) и с пробелами между тегами (лечится кучей способов, простейший — убрать эти самые пробелы). А то, что в старых IE нативный inline-block работает только для изначально строчных элементов, а для блочных называется "inline+layout" — не грабли, а "исторически сложившаяся особенность" :)

куда пнуть этот код

Добавить что-нибудь наподобие

* html .item-list .pager li { display: inline; height: 1px; } /* для IE6, если надо */
*+html .item-list .pager li { display: inline; min-height: 1px; } /* для IE7 */

(height/min-height тоже включают hasLayout, если смущает невалидный zoom).

Link to comment
Share on other sites

  • 0

Почитай внимательно то что тебе предлагают. поэкспериментируй и выбери для себя наиболее подходящий вариант.

Да вон Scrum сообщил, что флоаты можно выровнять с помощью text-align: center; smile.gif

Не флоаты, реч шла про inline.

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy