Bizon4ik
-
Posts
63 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Everything posted by Bizon4ik
-
Доброе время суток. Помогите плз со следующей проблемой: Я создаю горизонтальное меню через список. Высоту меню указываю в ul используя height:40px; И уменя получается ровное меню высотой в 40 пикселей. И все вродибы нечего если бы не одно но, мне нужно что бы один из пунктов меню был скажем 20px высотой, а все остальные остальсь 40px. Как это можно реализовать?
-
Great Rash спасибо за ваши подсказки и советы. Буду старатся улутшить свой СSS
-
Огромное вам спасибо.
-
Помогите разобраться плз почему при следующем коде: HTML: <body> <p class="footer_one"> </p> <div class="menu"> <ul> <li ><a href="#">All Clients</a></li> <li ><a href="#">Regions</a></li> <li ><a href="#">Board</a></li> <li ><a href="#">Working</a></li> <li ><a href="#">New Client</a></li> <li ><a href="#">Search</a></li> </ul> </div> </body> СSS body { margin:0; padding:0; } .footer_one { display: table; width: 809px; line-height: 22px; text-align: right; font-family: sans-serif; font-size: 10px; margin:auto; border:black solid 1px; } /*——————> Begin of Menu <———————--*/ .menu { margin:auto; width:809px; border:black solid 1px; } ul{ list-style:none; width:809px; height:40px; background:green top left repeat-x; } ul li{ float:left; display: inline-block; width: 134px; } .menu ul li a{ display:block; line-height:40px; font-size: 15px; font-family: sans-serif; color:#fff; text-decoration:none; text-align:center; } я получаю следующий резутат Почему во втором блоке есть отступы сверху и снизу и почему меню вылазит за размеры блока? И самое интерестно: Почему тут http://jsfiddle.net/Bizon4ik/h6ndL/ код работает? Заранее спасибо
-
Неужели нет догадок - почему нет ответов? ))) Как вам угодно ) SelenIT - огромное спасибо.
-
Неуже ли даже догадок нет по моим вопросам?
-
Может вопросы не понятные? Вы напишите в какой части, я попробую перефразировать.
-
Спасибо за ответ, он действительно помог. Я в этой части кода .header ul li a{ display:block; height:40px; font-size: 15px; font-family: sans-serif; color:#fff; text-decoration:none; text-align:center; vertical-align:middle; }поменял height:40px; на line-height:40px; и получил жилаемый вариант Вроди бы результат достугнут но понимание не пришло. Обясните мне, пожалуйства вот что: 1. Почему в выше указаном коде не работатет vertical-align? (если удалить его или прописать что то типа vertical-align:10px; то нечего не меняется, тоесть текст не двигается) 2. Второй вопрос вытикает из первого: если vertical-align не работает то как в случае необходимость в этом меню выранивать текст по вертикали (допустим прижать его к нижней границе миню) Для наглядности вот http://jsfiddle.net/Bizon4ik/VernX/ Заранее спасибо за ответ.
-
Параметр Padding'а не входит в вычисление размеров элементов. То есть, если у тебя в CSS прописано для элемента, например, height: 50px; и padding-top: 15px, то высота элемента будет = 65px. Тоже относиться и к border. Свойство box-sizing(-moz-box-sizing для FF) со значением - border-box, позволяет добавляться padding и border к заданному параметру высоты/ширины. Спасибо за обяснение.
-
Спасибо за ответ. У меня сейчас нет возможности протестировать ваш совет по коректировки моего кода, поэтому о нем отпишусь поже ). А ват метод с использование nav заитересовал. Подскажите, пожалуйста, а если необходимо меню с закругленными краями сделаными из рисунка то мне необходимо вначале меню и в конце добавить еще два пустых пункта меню небольшой ширины и в них вставить закругления, а текст по горизонтале выравнивать с помощю padding?
-
Помогите плз со следующей бедой. Пытаюсь сделать горизонтальное меню. Пока получилось следующее: Теперь я пытась выровнять текст по вертикали, но почему нечего не получается. При использовании margin или padding получаю следующий вариант (граница между блоками растягиваются в низ): Подскажите как же всетаки выровнять текст по вертикали и если не сложно обясните почему при использовании margin или padding я получаю выше указаный результат Мой код HTML: <body> <div class="header"> <ul> <li class="li_header_first"><a href="#">All Clients</a></li> <li class="li_header"><a href="#">Regions</a></li> <li class="li_header"><a href="#">Board</a></li> <li class="li_header"><a href="#">New Client</a></li> <li class="li_header_last"><a href="#">Search</a></li> </ul> </div> </body> Код СSS: *{ margin:auto; padding:0; } .header{ margin:auto; width:805px; } ul{ list-style:none; width:804px; height:40px; background:url(images/bg_header.gif) top left repeat-x; } ul li{ float:left; display: inline-block; width: 160px; } .li_header { border-right:1px solid #333; } .li_header_first { border-right:1px solid #333; background:url(images/li_header_first.png) top left no-repeat; } .li_header_last { background:url(images/li_header_last.png) top right no-repeat; } .header ul li a{ display:block; height:40px; font-size: 15px; font-family: sans-serif; color:#fff; text-decoration:none; text-align:center; vertical-align:middle; } Еще одна прозьба, если вы считатет что для написание веше указаного меня я где то сделал ошибку в коде или решил задачу не самым лутшим способом прошу так же указать на это буду вам примного благодарен. Заранее всем спасибо.
-
Да, такое ) Огромное спасибо
-
Доброе время суток. Подскажите, пожалуйсьта, где на этом сайте можно почитеть как создается горизонтальное меню по типу как оно реалезовано тут не использую таблицу (под горизонтальным меню и именю введу часть страницы где напизаны Статьи, Блог, Практикум, Рецепты и т.д.)