HTML Coding
Subforums
-
- 30.1k
- posts
-
- 1k
- posts
-
- Про макеты
- By klierik,
Explore Questions
There are no popular questions to show right now
-
0 votes0 answers
-
0 votes0 answers
-
0 votes0 answers
-
0 votes1 answer
-
0 votes3 answers
29542 questions in this forum
-
3 колонки % const %
Здравствуйте! Подскажет, пожалуйста, как можно получить такую резиновую верстку: 3 колонки % const % например так не работает, поскольку left-block и right-block блоки набегают на central-block-const при масштабировании браузера body { margin: 0px; padding: 0px; background-color: #f0f0f0; } #main { border: 1px solid #f00; width:100; padding:0px; margin:0px; position:relative; overflow:hidden; } #central-block-const { border: 1px solid #ff0; width:100px; margin: 0px auto; } #left-block { border: 1px solid #ff0; width: 40%; position:absolute; top:0px; left:0px; margin:0px; padding: 5px; } #right-block { border: 1px solid #ff0; width: 40%; position:absolute; top:0px; …
0 votes1 answer -
Какие косяки могут быть с "position:relative"?
В макете понадобился закрыть часть экрана блоком с "position:fixed". Из-за чего некоторые ссылки перекрылись этим блоком. Отслеживать поведение каждой - уйма времени. Вариант - задать всем перекрытым блокам position:relative и "вытолкнуть" их наверх через z-index. Какие при этом могут появится косяки? Например, переопределение родителя при абсолютном позиционировании (вместо body - позиционированный блок) или float будет корректно работать? Может ещё какие подводные камни?
0 votes0 answers -
Одно разрешение, разные размеры экрана.
Собственно, вопрос. Будет ли разница в вёрстке, если разрешение у ноутбуку (17 дюймов) 1600 на 1200, и у десктопа (22 дюйма) тоже 1600 на 1200. Подскажите, в чем будет отличие и как это проверять/фиксить
0 votes1 answer -
0 votes0 answers
-
Почему не появляется тень?
Собственно, сабж. Мне надо добавить тень к элементам. Так и записал: -webkit-box-shadow: 0 0 0 6px rgba (0,0,0,1); -moz-box-shadow: 0 0 0 6px rgba (0,0,0,1); box-shadow: 0 0 0 6px rgba (0,0,0,1); Но ничего не произошло. В чем обычно бывает дело, подскажите, будьте любезны.
0 votes2 answers -
Проблема с модальным окном
Был у меня один лендинг, человек попросил сделать похожий ленд под его тематику. В конце переделки (менял только картинки и текст) заметил что когда нажимаешь на кнопку "узнать стоимость" всплывающее окно показывается по центру лендинга а не по центру экрана. Сам сайт с проблемой http://zaprintuem.ru/ До этого, окно всплывало строго по середине ЭКРАНА. Этого и нужно добиться ! Код стилей: .popup_bg{ position: fixed; left: 0; right: 0; top: 0; bottom: 0; background: #211722; z-index: 2000; display: none; cursor: pointer; opacity: 0.75;}.popup_window{ width: 545px; padding: 6px; background: #f6f2eb; border-radius: 5px;…
0 votes1 answer -
свечение при нажатии на ссылку
Всем привет! Проблема: при нажатии на ссылку в стандартном браузере android, возникает желтое свечение (подсветка области нажатия). Как от нее избавиться? Возможно ли это? #userAgent - 4.0 Mobile Safari/533.1
0 votes0 answers -
помогите с прозрачностью
Люди помогите в верстке. Нужно получить вот такой элемент. http://s019.radikal.ru/i601/1301/89/d7ac2bf06bbe.gif В котором черный фон прозрачный текст и картинка нет. <section id="line_one"> <aside class="left"><img src="img/photo_like.gif"><p>Показать <br/> все фото</p></aside> <aside class="right"><img src="img/like.gif"><p>Мне <br/> нравится</p></aside> </section> стили .left { width:200px; height:61px; float:left; background:#000; border-radius:0 40px 40px 0; } .left img { float:left; margin:3px 0 0 10px; } .left p { padding: 5px 0 0 80px; } Пробовал по разному, к left…
0 votes2 answers -
Скругленные уголки у таблицы
Как только прописываю таблице border-collapse: collapse перестает работать border-radius у лиюбого элемента таблцы, хоть у table, хоть у <td> Убираю border-collapse: collapse - но тогда появляется геморрой с рамками внутри таблицы, они удваиваются, что в общем-то логично. Как застваить работать border-radius на таблице при border-collapse: collapse?
0 votes1 answer -
Наложение уголков
Есть вот такая картинка. Как считаете, можно ли обойтись в данном случае одним элементом? Всякие :before тоже не считаются. Как только задал вопрос, сразу же пришло решение. Надо использовать радиальный градиент. height: 100px; width: 100px; background: radial-gradient(#FFFAC0 49px, #6DC065 50px);
0 votes1 answer -
Карта-изображение в новом окне
Добрый день. Известно, что имеется способ "увеличить" мелкий рисунок из текста,выводя его в новое окно: <a href="images/stories/karta-maxi.png" target="_blank"> <img src="images/stories/karta-mini.png" /> </a> В связи с этим вопрос: Можно ли сделать так, чтобы на одной странице среди текста стояла маленькая картинка-ссылка для открытия ее большого карты-изображения в НОВОМ окне? При этом это увеличенное изображение в новом окне должно быть КАРТОЙ ссылок! Все найденные мной указания, в том числе и здесь http://htmlbook.ru/content/karty-izobrazheniya, сводятся к созданию карты прямо на текущей странице, без "переброса" на другую.
0 votes0 answers -
Наложение картины на меню
Привет всем! Подскажите, пожалуйста, как реализовать такую изюминку "]. Какие свойства прописывать в СSS? Трудность, в том, что картинка заголовка является не правильной прямоугольной формы, а с маленькой выступающей частью, которая и должна налагаться на горизонтальное меню.
0 votes1 answer -
Проблема с блоками.
Нужно сделать так И так .blockContent (БЛОК С КОНТЕНТОМ){ font-size:13px; color:#fff; text-shadow:1px 1px 0 #000; text-transform:none; text-decoration:none; border:1px solid #3399ff; -o-border:1px solid #3399ff; -moz-border:1px solid #3399ff; -webkit-border:1px solid #3399ff; } .blockAva (АВАТАР){ margin:5px 5px; height:100px; width:100px; text-transform:none; text-decoration:none; border:5px solid #fff; -o-border:5px solid #fff; -moz-border:5px solid #fff; -webkit-border:5px solid #fff; } .blockInfo (БЛОК С ССЫЛКАМИ){ float:right; height:170px; width:100px; margin-righ…
0 votes1 answer -
что это за шрифт?
столкнулся с проблемкой - не могу шрифт опознать... кто нибудь может подсказать - что это(сам телефон)
0 votes3 answers -
размещение изображений в виде таблицы без выравнивания по строкам
добрый день. Подскажите пожалуйста, как реализовать вывод изображений как на этой странице bersoantik.com/catalog/ Нужно чтобы все изображения выравнивались только по столбцам - по 3 в строке, но в строке чтобы если одно меньше, одно больше по высоте, то отступы между изображениями по вертикали были одинаковые, то есть как-будто какой-то небольшой хаос. Спасибо за помощь.
0 votes2 answers -
сылка на резиновом фоне
Здравствуйте, пытаюсь сделать следующее: Есть страницу, как фон устанавливаю картинку, делаю ее резиновой по этой статье: http://htmlbook.ru/css3-na-primerakh/masshtabirovanie-fona На этой картинке есть определенные объекты, кликая по которым пользователь переходит на другую страницу. Как сделать такое? Может кто видел подобное? Я так понял нужно как-то разметку ссылок подогнать под эти объекты?
0 votes0 answers -
Проблемы с созданием карты изображений.
Доброго времени суток, Уважаемые!) Помогите разобраться, если не трудно.. Суть в следующем: есть фотография, на каждом из персонажей которой спозиционированы гиперссылки и образованы области для щелчка. В FF и Google Chrome все работает на УРА, а в OPERA и IE проблемы - спозиционированные области ВНЕ изображения показываются и активны при наведении, а размещенные непосредственно на фотографии не активны. В чем могла бы быть загвоздка? Тут ссылка на эту страницу. Собственно, сам код: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>…
0 votes0 answers -
как убрать пробел в ie9
http://jsfiddle.net/jSwVs/ от есть менюшка и у нее стрелочка в низу в ie9 не соединяется есть ли вариант это исправить. тут проблема еше в том что непроходимо это делать обязательно шрифтами так как пользователи могут менять цвет активной плашки.
0 votes0 answers -
Форма поиска
В общем некая форма поиска HTML <div class="search"> <form method="get" action="/search" target="_blank"> <input name="q" class="search2" id="form-query" value="" placeholder="поиск по сайту"> <input src="img/searc.png" type="image" style="vertical-align: bottom; padding-left: -3;"/></form> CSS .search2 { width: 120px; height: 35px; } Нужно подвинуть картинку влево, чтоб получилось так http://s017.radikal.ru/i439/1204/14/d1e313d30fe5.png
0 votes0 answers -
0 votes2 answers
-
Центрирование элемента!
Всем привет!Произошла проблемка при верстке.Значит создал элемент с классом "wrapper" и присвоил в стилях атрибут "width:1000px;margin:0px auto;" Но элемент по чему-то не центрируется.В чем может быть проблема? Сори))Проблему решил)
0 votes0 answers -
масштабирование
такая страница OG.ddns.us/adivo хотелось бы ограничить масштабирование и убрать белое пространство при уменьшении масштаба, буду рад любой помощи.
0 votes0 answers -
Проблема с подчеркиванием у ссылок
<div id="boss_category_tabs" class="maintabs"> <div id="categorytabbg"><a>ССЫЛКА</a></div> </div> Ссылки идут с border-bottom:1px dashed. У дива categorytabbg при наведении задан цвет бэкграунда, так же задан паддинг 5px. Хочу задать свойство для ссылки .selected Никак не пойму, как реализовать. Если паддинг и бэкграунд задавать не диву, а напрямую ссылке, то как быть с подчеркиванием? Оно опускается слишком низко у неактивных кнопок.
0 votes0 answers -
Высота блока
На сайте центральный блок почему то очень нижний,он стаёт нормальной высоты только когда ставишь clear:both но тогда не нажимается кнопка подробнее в правом блоке.
0 votes1 answer -
css выподающее меню
В выпадающем меню верхняя часть каждой кнопочки не кликабельная. Хочется сделать возможность клика по любой части кнопки, желательно без js. Вот меню И код: .top-menu{ list-style:none; padding:0; margin:0; margin-top:0px; text-align: right; position: relative; } .top-menu li { float:left; height:33px; padding:0; margin:0px; margin-left:5px; width:150px; text-align:center; background:#333; position:relative; padding-top: 12px; border-radius: 5px 5px 0 0; } .top-menu li ul{ list-style:none; padding:0; margin:0; width:150px; display:none; position:absolute; z-index:999; left:0; top:45px; } .top-menu li ul li{ float:none; height:33px; margi…
0 votes2 answers