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
-
выравнивание в линию нескольких div-ов по центру
Здравствуйте, я нович в вёрстке исользую dremwuver 8, возникла следующая проблема. Сайт сделан таблицей из нескольких ячеек. Внутри самой большой мне нужно поместить четыре одинаковых блока (div). Но у меня не получается чтобы в общем все 4 были по центру. В самой ячейке таблицы ставлю выравнивание "center". В CSS стиле для div-ов ставлю ширину 155 px, margin=15 px, float=left - чтобы они встали друг за другом. Открываю в IE6 всё нормально, но как только в Mozila или в Opera, эти дивы смещаются к левому краю, и межстрочный интервал уменьшается. Помогите пожайлуста решить проблему.
0 votes7 answers -
Sublime text 3 problem with snippets
Установлен ST3 + Emmets, не работают snippets в css, в html все ок. Т.е. после табуляции он добавляет пробел и символ " ; " Проблема вроде как в emmets. Как на время этот плагин отключить кстати? И как сделать чтобы все работало вместе с этим плагином?
0 votes9 answers -
Вертикальное выравнивание внутри дива.
Вертикальное выравнивание внутри дива. Научите правильно это делать кросбраузерно и именно через vertical-align: middle Вариант с padding или line-height не подходит. Интересует, как правильно выравнивать по вертикали текст или другой див. Заготовил формочку: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <style type="text/css"> * { margin: 0; padding: 0;} .max1 { height : 300px; background: red; } .max2 { height : 300px; background: black; } .max2 div { height : 50px; width : 50px; background: green; } </style> </head> <body> <div class="max1">…
0 votes9 answers -
кроссбраузерная верстка 3-х столбцов
Прошу помощи дизайнеров. Есть у меня тривиальная задача. Но не получается у меня все красиво сделать. Мне нужно сверстать главную страницу, а именно информационную часть (то что находится между header и footer). В таблицах такое делается без проблем, но вот Дивами у меня никак не получается. Во вложении нарисовано как это должно выглядеть. Помогите с версткой.
0 votes19 answers -
Опять ж таки резиновый дизайн двухколоночный
Народ, знаю, что резиновый дизайн двух колонок обсуждался сто раз. Но нигде не встречал именно верстки, удовлетворяющей следующим условиям: 1) верстаем блоками 2) две колонки. первая - фиксированной ширины, слева. вторая - растягивается во всю ширину экрана 3) высота обоих колонок одинаковая (контент любой колонки задает высоту и другой колонки) 4) наконец, высота другой колонки реальная, а не задается border. Есть решение этой задачи? <div id="header"></div> <div id="content"> <div id="left_col"></div> <div id="right_col"></div> </div> <div id="footer"></div> Какой-нибудь css к этому....
0 votes19 answers -
Еще раз про DOCTYPE
Всем привет! Всех с наступающим Новым Годом! Вопрос: если на странице не будет DOCTYPE вообще - это чем чревато? Какую функцию выполняет этот DOCTYPE. Задаю вопрос вот почему: при тестировании дизайна страницы она корректно заработала только когда удалил DOCTYPE нафиг! Полез в Инет - везде пишут "...без доктайпа..." счастия не быват! А тут получается что быват....
0 votes22 answers -
Не накладываются слои.
Всем привет) Вот такая загвоздка - довольно стандартная - блоки не накладываются. Второй принимает за top 0px - нижний край верхнего блока. Всю голову сломала, но не вижу ошибку, поэтому обращаюсь за помощью. Слаба я еще очень в этих делах. Спасибо. #shapka { position:position: relative; width: 794px; /* Ширина слоя */ height: 342px; /* высота слоя */ margin: 0 auto; /* Выравниваем по центру */ background: #990000; /* Цвет фона */ background-image: URL(tr_01.gif); z-index: -1; } #menu { position: relative; top: 292; width: 794px; /* Ширина слоя */ height: 45px; /* высота слоя */ margin: 0 auto; /* Выравниваем по центру */ z-index: 1; }
0 votes17 answers -
Фиксирование
Добрый день всем! Я начал верстать макет, в задании сказано: Т.к. я новичёк, мне хотелось бы узнать, что это и как это сделать? Насколько я понял это делается вот так: body { background: #ffffff; background-image: url(images/bg.gif); width: fix; height: fix; }
0 votes54 answers -
Не работает z-index
Есть три картинки, для каждой в стилях установлен свой z-index. При наведении мыши на изображение оно должно всплывать выше всех остальных, а вокруг него появляться другая рамка. Далее идет код. Рамка меняется, но изображение "не всплывает" относительно других. Т.е. при наведении мыши z-index не меняется. В чем дело? <!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> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>z-index</title> <style type="text/css"> .card { position: relative; }…
0 votes5 answers -
позиционирование
Здравтсвуйте. Вставляю этот сss код : .shef { position: absolute; top:0; left: 600px; } html код: <div class="shef"><img src="images/shef.jpg" alt="shef" width="160" height="220"/> </div> Все нормально пока не уменьшил окно браузера , это (все вроде ок) до уменьшения окна браузера : http://smages.com/30/db/30db8bba757aedbdb7...4f24948.png.htm а это после уменьшения окна браузера: http://smages.com/cf/b3/cfb3e2283558117ba6...9258933.png.htm Изображение не смещается а остается на месте . Объясните пожалуйста , в чем может быть причина?! Спасибо. P.S. изображение вставил для примера, то что под руку попалось
0 votes15 answers -
Неправильно работают якоря
Всем привет! Возникла такая проблемка с якорями сайта http://thisissite.esy.es/ Нажмите на сауна, дкакузи и питание. Прокручивают не к якорю а к концу блока.
0 votes10 answers -
не работает margin:0 auto;
Доброго времени суток, столкнулся с такой проблемой, искал решение, нашел на вашем форуме похожую тему но рекомендации оттуда мне не помогли, проблема в том что я не могу отцентрировать блок div .mobnamaz{ padding:31px 3px 3px 90px; width:100%; } @media only screen and (max-width : 767px) { .mobnamaz { position: relative; width:100%; padding:0; margin:0 auto !important; } } собственно блок должен центрироваться только на мобильных устройствах, на данный момент в результате экспериментов у меня получился вот такой код, но это не работает. Вот собственно и сам div <div class="mobnamaz"> <iframe></iframe> </div> если…
0 votes2 answers -
округление углов с помощью тэга background
что-то мозгов не хватает, подскажите как реализовать. П.с. если фоном таблицы уже является рисунок.
0 votes1 answer -
z-index и select
Всем привет! Помогите селект за дивку спрятять!!!!! Вот код: <div style="position:absolute; left:43px; top:4px; z-index:10; background:#CCC; height:200px; width:200px;"></div> <select> <option>111111111</option> <option>2222222222</option> <option>3333333333333</option> <option>4444444444444444</option> </select>
0 votes7 answers -
hover как центрировать фон
Есть ссылки при наведении на них должен появляться бэкграунд, сам бэкграунд шире ссылок, и начинается он при наведении с первой буквы ссылки и дальше идет пока незакончится. Так вот вопрос как мне центрировать этот бэкграунд? <a href="#" class="a-link"><span class="date-color">14.02.2011</span> <p class="line">Обновление Ассортимента</p></a> <a href="#" class="a-link"><span class="date-color">14.02.2011</span> <p class="line">Обновление Ассортимента</p></a> <a href="#" class="a-link"><span class="date-color">14.02.2011</span> <p class…
0 votes16 answers -
div фон
Подскажите пожалуйста ! Есть контейнер в нём все дивы в цсс пытаюсь сделать так,что бы у див лефт картинка была растянута и что бы это по ИЕ 7 подходило , но никак не получается...кто подскажет ??? #left{ background:url(i/170.jpg) center no-repeat; /*background: url(i/170.jpg) no-repeat;*/ /*background-color: #0ff;*/ background-size: 100% 100%; /*расстягиваем картинку под див*/ /*border: 1px solid #000000;*/ width: 70%; height: 400px; float: left; /*обтекание блока по правой стороне другим блоком*/ } <div id="container"><!--CONTAINTER STARTS--> <div id="header">header</div> <div id="…
0 votes42 answers -
Не могу понять
Извините, конечно, что повторяю некоторые проблемы, но: Мозила фаир 3 не хочет отображать картинки, ИЕ отображает, искал решение, подсказали относительные папки и всё такое, помогите разобраться, допустим картика находиться тут: c:/www/images/picture.png (изначально так писал) то относительный адрес будет таков: images/picture.png (я так написал, картинка не отображалась) или каким адресом, если не трудно напишите. Заранее спасибо.
0 votes13 answers -
Смещение блоков при увеличении / уменьшении масштаба
Всех приветствую. Возникла проблема. При увеличении / уменьшении масштаба просмотра страницы сайта, смещаются блоки. Например: Обычный вид: Уменьшение: Требуется зафиксировать положение.
0 votes11 answers -
Скрытие/Раскрытие колонок таблицы путем подмены класса ячейки через Javascript
Добрый день, пожалуйста, подскажите Новичку! Задача. Есть достаточно большая таблица, которая должна быть пригодна для ручного редактирования в Визивиг-редакторе системы CMS. При показе ее на сайте должна отображаться только самая левая колонка ПЛЮС еще одна колонка(группа колонок), зависящая от выбранного пользователем варианта. Поискав на разных форумах нашел что-то подобное, что вроде бы должно работать одинаково в основных браузерах. Адаптировал найденное под нашу задачу, проверяя работу под IE. НО потом оказалось, что в Опере и FF скрипты работают, но несколько по другому. ПОЧЕМУ - понять не могу. Прошу помощи в исправлении ошибки. Буду благодарен, если предложите …
0 votes4 answers -
Разная отрисовка шрифта из google fonts.
Здравствуйте. Верстаю сайт, на котором используется шрифт "PT Sans". Загрузил его из гугло-шрифтов. Как мне всегда казалось, этот сервис автоматические определяет какой формат шрифта нужно отдавать... То есть он детектит браузер и ротатор выдает нужный тип шрифта. И тут случилась проблема... Вот я прошу отдать мне файл <link href='http://fonts.googleapis.com/css?family=PT+Sans:400,400italic&subset=cyrillic' rel='stylesheet' type='text/css'>Подключаю его в стилях .product-params-short .buy-block { font-family:'PT Sans', sans-serif; font-size:18px;}Имеем. Firefox: http://rghost.ru/51191900.view Chrome: http://rghost.ru/51191905.view Надеюсь, проблема ясна - ш…
0 votes18 answers -
Перенос на новую строку после ссылки!
Привет, всем! тут такая проблема - есть список, в нем в каждом пункте текст, в тексте ссылки... почему после ссылки текст переносится на другую строку?? http://kanskbank.topfire.ru/1200/1208/1252# тут проблема во всей красе ) "Сеть офисов банка позволяет банку всегда быть территориально рядом с клиентом и оказывать услуги во всех городах Сибири ..."
0 votes2 answers -
Задачка. Обтекаемый футер снизу.
Всем Добрый день. Есть следующий вопрос: как можно сделать обтекающий слой прижатым к низу (см. изображение). Высота wrapper будет зависить соответственно от кол-ва контента в блоке left с указанным float. Для вроде бы простой проблемы - в инете решений не нашел (есть только решения для фиксированной высоты), пробовал делать сам следующим образом (путем добавления блока с clear:left и вымещением вверх футера margin-top:-40px;): HTML: <!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> <meta http-equiv="Content-Type" content="text/html; ch…
0 votes32 answers -
HTML5 - валидное отключение кэширования html-страницы..
сабж такой.. в head'е старницы выставляю согласно вот этому <meta http-equiv="Cache-Control" content="no-cache"/> данный валидатор ругается.. кстати, пендосы тоже по этому поводу плачут)) - в самом низу пост от некоего "Raanan Avido".. вобщем, ничего из кода ниже не подходит.. <meta http-equiv="pragma" content="no-cache" /> <meta http-equiv="cache-control" content="max-age=0" /> <meta http-equiv="cache-control" content="no-cache" /> <meta http-equiv="cache-control" content="no-store" /> да и не сможет подойти, потому как в HTML5 согласно этому материалу у http-equiv есть следующие значения - "content-language, content-type, default-style,…
0 votes2 answers -
Ростолкуйте CSS правило
min-Height работающий в FF, IE6, IE7, Opera .minHeight { min-height: 200px; height: auto !important; height: 200px; } Растолкуйте плиз, как браузеры читают правило и почему соответственно работает во всех.
0 votes6 answers -
Увеличьте размер активных элементов на странице
При проверки скорости сайта для телефонов или PageSpeed Insights Пишет, что увеличьте размер активных элементов на странице Некоторые ссылки и кнопки на страницах вашего сайта слишком малы, и поэтому пользователям устройств с сенсорными экранами может быть неудобно нажимать на них. Увеличьте активные элементы, чтобы сделать свой сайт удобнее. (https://developers.google.com/speed/docs/insights/SizeTapTargetsAppropriately)Объяснение:Указанные ниже активные элементы расположены слишком близко к соседним. Увеличьте расстояние между ними.Активный элемент <span class="load-button"> и ещё 3 расположены слишком близко к другим активным элементам. finalАктивный элемент <s…
0 votes4 answers