Набор кнопок в стиле JQuery от UL?

Я сейчас тематизации сайт, и навигация в формате списка:Набор кнопок в стиле JQuery от UL?

<ul> <li>nav1</li> <li>nav2</li> ... </ul>

Я хотел бы, чтобы включить список в buttonset с закругленными углами только снаружи.

ASCII-арт приближение:

(nav 1 | nav 2 | nav 3 | nav 4)

Там отличный пример в JQuery-UI, но он предназначен для радио кнопки вместо элементов списка. Я пробовал самостоятельно внести изменения, но IE не распознает: последний-ребенок, поэтому я не мог получить правильные углы округленными.

Любые советы/предложения?

источник

2012-01-27 Andrew Miller

разметка будет выглядеть следующим образом:

<ul> 
    <li class="first">button1</li> 
    <li class="second">button2</li> 
    <li>button3</li> 
    <li class="last">button4</li> 
</ul>

СМЧ для этого:

ul {margin:0px;padding:0px;list-style-type:none;} 
ul li {margin:0px;padding:0px 5px;border:1px solid #333;} 
ul li.first {border-top-left-radius: 100px;border-bottom-left-radius: 100px;border-right:0px;} 
ul li.last {border-top-right-radius: 100px;border-bottom-right-radius: 100px;border-left:0px;} 
ul li.second {border-right:0px;}

источник

2012-01-27 18:47:31

Просто используйте границы радиуса на самой ул.

http://jsfiddle.net/T4cRS/

должны быть действительно с помощью HTML5 <nav> тег, если вы используете <!doctype html>

источник

2012-01-27 19:46:27

границы радиуса не будет работать в IE8 и ниже. –

Набор кнопок в стиле JQuery от UL?

ответ

Смежные вопросы