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
-
Поменять border родителя при фокусе дочернего input
Нужно помять border родителя при фокусе дочернего элемента http://jsbin.com/pixut/10/edit?css,output Пробовал так, не получается. Без js это возможно? form span { display: inline-block; font-size: 18px; line-height: 1; background-color: #fff; padding: 6px 2px 6px 36px; margin: 20px; border: 1px solid #666;}form input { border: none; width: 360px; padding: 0; margin-right: 0px; font-size: 24px; color: #737373; transition: color 0.2s, border-color 0.2s; display: inline-block;}form input:focus { color: black;}span<input:focus{border:1px solid blue;
0 votes9 answers -
В хроме не срабатываеет медиа-запрос при экране менее 784 (решено)
Страница: http://seositi.ru/ в мобильной версии разделы сайта должны быть во всю ширину. @media only screen and (max-width: 479px) { *** .site-categories ul li { float: left; display: table; width: 96%; margin: 0 1% 20px; padding: 10px 1%; // border-radius: 5px; height: 100px; max-height: 100px; } *** } в лисе и Яб-е, все ок. а в хроме почему-то не срабатывает @media only screen and (max-width: 479px) { и применяется прежний стиль, а именно only screen and (max-width: 991px) and (min-width: 768px) Попытался выяснить в чем дело: Полностью очистил файл respo…
0 votes0 answers -
Float и отступ
Вечная проблема этот float, уже переюзал все примочки чтобы отклерить это обтекание и всегда к род. блоку добавляется отступ снизу, никак немогу сним договорится, може форумчане вкурсе, чем его можно взять??
0 votes4 answers -
.gif прозрачность в ie6
Помогите пожалуйста реализовать карту Италии построенную на gif и css. Собственно сайт auto-bazar.it где это есть и работает кроме ie6, и сайт www.autoitalia.it от куда это взято. Пожалуйста не смотрите что я просто взял и скопировал чужую карту, в дальнейшем по максимуму ее переделаю. Цвет другой и размер нужен побольше. Но за основу взял именно ее. Проблема в том что на сайте autoitalia.it в ie6 все работает отлично, прозрачности отображаются, а у меня нет. Подскажите в чем проблема. Всем спасибо за помощь.
0 votes7 answers -
Круглые углы таблицы
Нужно сделать круглые углы у дива, и внутри дива таблица(с 90градусными углами), за таблицой и до границ дива(расстояние не более 5пикселей) фон нужного мне цвета, как так сделать?
0 votes18 answers -
Занятный ослиный косяк
Есть вот это, надо смотреть в IE6 и IE7. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=windows-1251" /> <title>Untitled Document</title> <style type="text/css"> <!-- DT{width:12em;} DD{width:18em; margin-left: 12em; margin-top:-1.2em;} INPUT, SELECT{width:100%;} --> </style> </head> <body> <form method="get" action="#"> <dl> <dt><label for="id1">Поле:</label></dt> <dd><in…
0 votes14 answers -
Прозрачность background в IE
Добрый день ! Сталкнулся с проблемой background . В мазиле он прозрачный т.е. наследует по умолчанию отцовский а в IE нет , просто белый , пытаюсь убрать его не получается помогите .
0 votes11 answers -
Проблемы с масштабом в разных браузерах.
Давно верстаю, но с таким еще не сталкивался. Гугл ничего вразумительного не выдает. В общем, проблема такая: При 100% масштабе высталенном в каждом браузере, странца все же умудряется отличаться по размерам в разрых браузерах. Заметил это при верстке своего сайта, потом решил зайти и посмотреть есть ли таже проблема с другими сайтами, там оказалось все то же самое. Причем судя по ширине выводимой страницы chrome и IE правильно показывают масштаб, а вот остальные браузеры нет. Хотя, повторюсь, в настройках у всех браузерах стот 100% масштаб. Не знаю теперь как это все к общему виду привести. Вручную, с помошью тега meta можно конешн масштаб выставить на вид один, но …
0 votes3 answers -
сдвиг в списке.
Вот задался задачкой. Как написать CSS чтобы в HTML списки при добовлении новго элемента списка уменшался отступ от начала строки. Пример: _______Категория1 _____Категория2 ___Категория3 _Категория4 HTML: <li>Категория1</li> <li>Категория2</li> <li>Категория3</li> <li>Категория4</li> чтоб небыло индификаторов номера строчки списка или типа того внутри списка. Есть предложения к задачке?
0 votes9 answers -
0 votes5 answers
-
верстка блока с иконкой и рамкой, и текстом внутри
Здравствуйте. Подскажите начинающему, как правильно сверстать блок такого плана Скрытый текст (смотри рисунок) , когда по периметру идет граница, а на верху блока иконка возле которой границ нет, но потом есть. Попробовала все это сделать через background.. но не знаю, на сколько это правильно. Ну и хочу, чтобы все это адаптивно было. И как правильно верстать вот такое дерево блоков?
0 votes4 answers -
В Mozilla cлои перескакивают, в IE - нет
Привет! Есть небольшие непонятки относительно поведения двух слоев в контейнере при использовании min-width: в IE слои слушаются этот min-width и не перескакивают друг под друга, а в Mozilla - перескакивают... Это почему происходит и как это вылечить. Код дивов: <div id="menu_niz"> <div id="menu_niz_left"></div> <div id="menu_niz_right"></div> </div> CSS: #menu_niz { position:absolute; width:100%; height:47px; top:100%; left: 0; margin-top: -92px; z-index:4; color: #FFFFFF; font-family: Tahoma, Verdana, Arial; font-size:14px; font-weight:bold; min-width: 965px; } #menu_niz_left { float:left; margin: 15px 0 0 5px; co…
0 votes6 answers -
Проблемы с таблицами в IE
Сейчас я редактирую скин для форума, и сделал по обеим сторонам колонки в виде картинок формата png Вот код: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xml:lang="en" lang="en" xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=<% CHARSET %>" /> <link rel="shortcut icon" href="favicon.ico" /> <title><% TITLE %></title> <% GENERATOR %> <% CSS %> <% JAVASCRIPT %> </head> <body> <table width="1078" align="center" cellpadding="0" cellspacing="0">…
0 votes2 answers -
Лишний отступ в диве
Друзья, доброго времени суток! У меня проблема. Делаю вёрстку верхнего меню дивами и списком, и непонятно откуда в диве перед списком взялся отступ, видимый в Опере и ФФ, но не существующий в IE7. Суть такая - в сумме ширина вложенных в див элементов списка, заданная конкретными значениями, меньше самого дива (его ширина тоже задана абсолютным значением), но тем не менее див переполняется и крайний левый элемент списка вылетает за пределы дива. Такое ощущение, что внутри дива находится отступ, либо откуда-то берутся поля у элементов списка, ходя в коде я их не задавал. Подскажите, в чём может быть дело? Картинка <html> <head> ..... <style type="text/css"&…
0 votes5 answers -
Помогите с expression(document.getElementsBy
Привет всем. Вот вожусь с проблемкой - необходимо сделать отступ дива относительно контейнера/другого дива. В CSS пишу left: expression(document.getElementsById( 'container' ) + 300px'); но что-то пока не работает. подскажите как сделать. Спасибо.
0 votes3 answers -
Резиновые трехколоночные макеты
Систематизировал различные варианты резиновых трехколоночных макетов, в итоге получил их 13 разновидностей. К примеру, такой (px ∞ px) означает, что первая и третья колонка задана в пикселах, а средняя занимает оставшееся пространство. Макет (% % %) означает, что ширина всех колонок указана в процентах. 1. ∞ px px 2. px ∞ px 3. px px ∞ 4. % % % 5. % ∞ px 6. ∞ % px 7. (% %) px (ширина первых двух колонок принимается за 100%) 8. px % ∞ 9. px ∞ % 10. px (% %) (ширина последних двух колонок принимается за 100%) 11. % px ∞ 12. ∞ px % 13. ∞ px ∞ (здесь левая и правая колонка равны между собой)
0 votes11 answers -
Загрузка изображений до вывода на экран
Добрый день! Вопрос в следующий : Есть страница с изображениями хотелось бы узнать , можно ли как то реализовать чтоб все изображения подгружались пользователю а потом только вывадилась страница с текстом и изображениями . Чтоб пользователю видел уже готовую страницу.
0 votes17 answers -
[jQuery] выпадающее меню ajax
Здравствуйте. Я не знаю Javascript, поэтому обращаюсь за помощью. На сайте использую выпадающее ajax-меню от Anton Shevchuk (http://anton.shevchuk.name/book/code/menu.ajax.html) Это меню срабатывает при hover. Можно как-то переделать код, чтоб меню срабатывала при клике? $(function(){ //обработчик для события hover для элементов li $('.topmenu ul li').hover( function() { // добавляем проверочку - не загружали ли до этого элементы if ($(this).find('ul').length == 0) { var file = $(this).data('file'); var li = $(this); $.ajax({ url: 'ajax/'+file+'.html', // указываем URL beforeSend: function(){ li.addClass('loading'); }, success: function(da…
0 votes1 answer -
ссылка на список вылетающий
есть такой вылетающий список <HTML> <head> <title>Preview</title> <script type="text/javascript" src="file:///C|/Program%20Files/SourceTec/Sothink%20DHTML%20Menu%208/Resource/js/stmenu.js"></script> <script type="text/javascript"> <!-- window.onerror=function(m,u,l) { window.status = "Java Script Error: "+m; return true; } //--> </script> </head> <body bgcolor="#FFFFFF" leftmargin="5" topmargin="5"> <script type="text/javascript"> <!-- stm_bm(["menu1a91",810,"","file:///C|/Program%20Files/SourceTec/Sothink%20DHTML%20Menu%208/Resource/blank.gif",0,"","",0,0,250,0,1000,1,0,0,"","",0,0,1,2,"defau…
0 votes4 answers -
Различное поведение при скруглении углов.
Здравствуйте, есть код: .test { border: 5px solid #123; overflow: hidden; background: #555; width: 100px; height: 100px; border-radius: 20px; } .test-inner { overflow: hidden; background: #621; width: 55px; height: 55px; } <div class="test"> <div class="test-inner"></div> </div> Результат: FF4 и IE9 все хорошо в Opera и Chrome вылез угол Возможно ли исправить проблему в Opera и Chrome? P.S. Вариант со скруглением внутреннего блока не подходит.
0 votes13 answers -
Фон сайта
Друзья! У меня есть свой сайт, пишу в html, но тут столкнулся с проблемой: хочу сделать фон сайту картинкой, делаю, но у меня контент сайта тоесть где написан текст, тоже становится прозрачным и становится ка картинка. Так вот вопрос, что мне сделать, чтобы фон сайта был нижним слоем? вот код: <HTML> <TITLE>Всё о цветах</TITLE> </HEAD> <body> > <center> <TABLE width="750"border="1"> <TR><TH colspan="2" width="750" height="150" bgcolor="#A0CFFF"> <img src="sait.jpg"> </TH> </TR> <TR> <THEAD> <TH bgcolor="#CCFFFF" width="120"valign="top"><a href="index.html" style="text-decor…
0 votes17 answers -
Использование атрибута type у тега <link> в HTML5
Здравствуйте! Проясните пожалуйста вот по какому вопросу. Пишу на HTML5. И возник вопрос: использовать ли атрибут type со значением "image/x-icon" в теге <link> при вставке favicon? Или же можно опустить этот атрибут? Как это будет правильнее в HTML5, как лучше? Примеры: <link rel="shortcut icon" href="favicon.ico" type="image/x-icon"> или же: <link rel="shortcut icon" href="favicon.ico"> Заранее благодарен.
0 votes5 answers -
div внутри head
Можно ли и будет ли работать, если я вставлю в head тег div и оберну ещё им тег link?, то есть вот так: <head> <div class="myBlock"> <link href="styles.css"> </div></head> Только, пожалуйста, не спрашивайте зачем, мне просто надо знать и все тут... Спасибо.
0 votes5 answers -
Как сделать такую сетку
Итак, имеется 4 блока, на мобильных устройствах они располагаются в столбик, друг за другом. Задача: сделать для больших разрешений сетку в два столбца, в которой высота всех блоков может быть различной, и не должно быть разрывов между блоками
0 votes15 answers -
Скругленные углы
Знаю, скругленные углы это заежьженая пластинка, но ничего конкретного по этому поводу не нашел, кроме одного, если кто знает прамир, дайте ссылку плз. Вот нашел это Мой макет: Проблема в том что левый нижний угол дублируется в диве, как на рисунке. Вот CSS: #content { width: 927px; height: auto; padding: 0 0px; /*background: #f8e6cc*/ background: #2a3742 url(images/bgg.png) repeat-x top center; /*полоса для градиента, если в ней причина, можно убрать*/ } .corners { background: url(images/left_top.png) top left no-repeat; } .corners div { background: url(images/right_top.png) top right no-repeat; } .corners div div { background: url(images/right_bot.png) botto…
0 votes11 answers
-
Обсуждения
-
Актуальные контакты: Telegram: @Nikker_web E-Mail: tarasevich.email@gmail.com Портфолио https://www.behance.net/d4d4186e Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ -
Актуальные контакты: Telegram: @Nikker_web E-Mail: tarasevich.email@gmail.com Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ Портфолио https://www.behance.net/d4d4186e
-
Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок Xenforo. Версия 2.2.10. Стиль дефолтный. Что именно нужно в итоге на фото примере. Мой шаблон app.footer less имеет следующее значение. .p-footer { .xf-publicFooter(); a { .xf-publicFooterLink(); } } .p-footer-inner { .m-pageWidth(); .m-pageInset(); padding-top: @xf-paddingMedium; padding-bottom: @xf-paddingLarge; } .p-footer-row { .m-clearFix(); margin-bottom: -@xf-paddingLarge; } .p-footer-row-main { float: left; margin-bottom: @xf-paddingLarge; } .p-footer-row-opposite { float: right; margin-bottom: @xf-paddingLarge; } .p-footer-linkList { .m-listPlain(); .m-clearFix(); > li { float: left; margin-right: .5em; &:last-child { margin-right: 0; } a { padding: 2px 4px; border-radius: @xf-borderRadiusSmall; &:hover { text-decoration: none; background-color: fade(@xf-publicFooterLink--color, 10%); } } } } .p-footer-rssLink { > span { position: relative; top: -1px; display: inline-block; width: 1.44em; height: 1.44em; line-height: 1.44em; text-align: center; font-size: .8em; background-color: #4682B4; border-radius: 2px; } .fa-rss { color: white; } } .p-footer-copyright { margin-top: @xf-elementSpacer; text-align: center; font-size: @xf-fontSizeSmallest; } .p-footer-debug { margin-top: @xf-paddingLarge; text-align: right; font-size: @xf-fontSizeSmallest; .pairs > dt { color: inherit; } } @media (max-width: @xf-responsiveMedium) { .p-footer-row-main, .p-footer-row-opposite { float: none; } .p-footer-copyright { text-align: left; padding: 0 4px; // aligns with other links } } -
Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок. -
By Katerina23 · Posted
Да, подходит. Спасибо. -
<input type="number"> -
By Katerina23 · Posted
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-