-
Posts
65 -
Joined
-
Last visited
Content Type
Profiles
Forums
Calendar
Store
Posts posted by FitTech
-
-
что значит после, стрелка с задержкой появляется?а после не выходя за рамки блока должна стрелка добавляться.
после текста в ссылке
Всё уже решил, просто сделал стрелку background и позиционировал.
-
Насколько я понял, ты в ссылку блочный элемент (параграф) засунул?
Что бы стрелка появилась используй background, так надежней.
а по поводу кода стрелки - ты шрифт этих кодов подключал?
Да, запихнул параграф, уже просто не знал как всё сделать..
-
Здравствуйте!
Есть ссылка, а в ней текст выделен через <p>, ссылке заданы размеры и отображение блоком.
При наведении, нужно чтобы блок и текст стал зелёным цветом, а после не выходя за рамки блока должна стрелка добавляться.
Два варианта думал: первый это вырезать стрелка в фотошопе и сделать бэкграунд, а второй просто добавить текст(код стрелки в html), только ничего не получается вторым способом, как реализовать?
p:hover:after ? или как? -
-
Вставляй через :before и позиционируй абсолютно.
Прочтите сообщение выше и попробуйте сами.
Если не получится:
http://jsfiddle.net/0jta2u58/1/
Разделите кнопку по частям и эти части поместите в соответствующие места(синий и зеленый прямоугольники(понятное дело у меня размеры на глаз).
Достаточно кроссбраузерный код, если вам конечно не нужны IE ниже 8ки.
Всё отлично получилось, спасибо, а как решить вопрос такой:
Когда просто бегаю по меню(сверху в низ), то вид не очень красивый, оно всё прыгает быстро, как можно решить?
-
Здравствуйте! Вот макет:
Делаю меню и есть вопрос по зеленой картинке там где Контакты, собственно нужна помощь как ее реализовать.
В макете она разделена на две части:
Оригинал:
Теперь части:
Первая
Вторая
Между элементами списка высота фиксирована.
Вот как я попробовал решить задачу:
<ul class="menu"> <li class="black-list"><a href="#">Главная страница</a></li> <li class="black-list active" ><a href="#">Контакты</a></li> <li class="black-list"><a href="#">Наш прейскурант</a></li> <li class="black-list"><a href="#">Стоматологический словарь</a></li>.....
/* Стиль ко всему списку */.menu{ margin-top: 26px; list-style: none; font-family: Arial; color: black;}/* Отступы между элементами */.menu li{margin-bottom: 17px;}/* Контакты */.active{ background: url("img/contacts.png") no-repeat; /* Поставил изображение как фон */ height: 50px; width: 300px; position: relative; left: -20px; padding-left: 19px; padding-top: 4px; margin-bottom: 4px !important;}/* цвет текста в Контакты */.active a{ color: white;}
Вот что получается:
То что нужно, но отступ между Контакты и следующим элементом слишком велик, а уменьшить не получится потому что высота картинки задана.
Подскажите пожалуйста как правильно решить задачку.
-
В самый верх добавь
.block1, .block2, block3{
vertical-align:top;}и для обёртки никогда не назначай фиксированную высоту, лучше вообще её не указывать или пиши её так: min-heightдля обертки и блоков указал высоту для себя чтобы видеть сетку)
Спасибо, помогло!
-
Извините, сделал ошибку в названии темы
Подскажите в чем проблема?
Вот есть расположение блоков:
<!DOCTYPE html><html><head> <title>Дантист</title> <link rel="stylesheet" type="text/css" href="style.css"> <meta charset="utf-8"></head><body><div class="container"> <div class="block1"> <a href="#"><img src="img/logo.png"></a> </div> <div class="block2"></div> <div class="block3"></div></div></body></html>
и css
*{ padding: 0; margin: 0;}.container{ width: 1070px; margin-left: auto; margin-right: auto; background-color: #f5f5f5; height: 1000px; margin-top: 34px; }.block1{ width: 267px; height: 1000px; background-color: grey; margin-left: 8px; display: inline-block;}.block2{ width: 486px; height: 1000px; margin-left: 20px; margin-right: 30px; background-color: yellow; display: inline-block;}.block3{ width: 251px; height: 1000px; background-color: green; display: inline-block;}
Но когда я в .block1 добавляю <a href=''#''><img src="img.png"></a>, то вот что получается
Почему так?
-
Сбросьте пожалуйста макет, хочу попробовать.
-
почитайте основные ошибки коллег в этой теме. Чьи посты были до вас. Большая часть ошибок повторяющаяся.Я бы хотел получить подсказку как правильнее сделать в том или ином моментеТак и сделаю, спасибо
-
раз знаете, зачем спрашивать?я знаю в нем очень много ошибок начиная с самого простогоСами посмотрите на свой сайт. Половину блоков, особенно форма, уехали кто куда.
Тени по бокам разные.
Кнопки соц. сетей лесенками.
Я бы хотел получить подсказку как правильнее сделать в том или ином моменте.
Это явно не <input>, а <textarea>. Кнопки соц. сетей как-то не ровно расположены или так должно быть? А где сам макет?
Понял, спасибо
-
Здравствуйте! Это второй мой макет, я знаю в нем очень много ошибок начиная с самого простого.
Укажите мне пожалуйста по возможности все ошибки. Спасибо!
http://mysitegolden1.tioo.ru/ -
Здравствуйте! Подскажите пожалуйста, где можно скачать psd макет сайта и его исходный код чтобы видеть как в том или другом месте сверстано и сравнивать свое.
Заранее благодарен!
google - free template
Лишь бы написать...
-
Здравствуйте! Подскажите пожалуйста, где можно скачать psd макет сайта и его исходный код чтобы видеть как в том или другом месте сверстано и сравнивать свое.
Заранее благодарен!
Как задать нестандартный фон
in HTML Coding
Posted
Можно вырезать часть фона не по ширине, а вертикально и сделать repeat-y