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
29,542 questions in this forum
-
Как сделать отступ между Li:before и текстом
https://codepen.io/nikki4/pen/BGLNOQ Как в указанном примере расположить слово "текст1" по длинный?
0 votes2 answers -
поля от 'body'
Вопрос такой: - имеется код: <!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>Непонятный отступ</title> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <style type="text/css" media="all"> /* <![CDATA[ */ /* — global — */ html { font-size: 100.01%; } body { font-size: 62.5%; /* - '1em' = '10px' - */ } .wrapper { width: 1000px; min-height: 100%; height: auto !important; height: 100%; margin: 0px auto; background: #ddd; } /* — // global // — */ /* — test — */…
0 votes6 answers -
Что не так-то?
Доброй ночи всем. Верстал один макет и столкнулся с одной странностью в виде ИЕ9. Он не захотел уместить меню в 980пк, причем с очень большим отклонением от нормы. Хотя остальные все браузеры с ним не согласились и спокойно заняли все выделенное ему место. Пробовал на инлайн-блоках и флотах - результат одинаковый. А теперь самое интересное. Помимо фф, оперы, хрома, меню влезло в ИЕ8 и даже в ИЕ7.Внимание, вопрос: почему?? Может это я уже глубокой ночью не соображаю и что-то не доглядел или я чего-то про 9-й не знаю? Вот хотел прояснить. Пример
0 votes28 answers -
Выпадающая строка поиска на бутстрапе 3
Добрый день. Скажите можно ли и как можно сделать на бутстрапе 3 поле поиска, которое видно на больших экранах, а на маленьких представляет собой иконку с лупой, кликая по которой снизу раскрывается строка на всю ширину для ввода искомого текста? Функционал иллюстрируется главной страницей М-Видео - сначала поиск раскрыт на широком экране, а на узком представляет собой иконку, клик по которой раскрывает поле поиска
0 votes5 answers -
Плавающее боковое меню дергается при скроле вниз
Салют товарищи! Беда скорее всего в CSS, так как такой же скрипт отлично работает на демо странице его автора. На сайте реализовано плавающее боковое меню, но оно, зараза дергается при скроле вниз. Когда вверх - все норм. Может там всё элементарно, да я туплю просто? Подскажите пожалуйста, в какую сторону копать хотя бы Страница с проблемой - https://virtualrift.net/games/ar/the_machines_mnogopolzovatelskaja_igra_v_dopolnennoj_realnosti_odobrennaja_samoj_apple/2-1-0-5003?lk6hKO Взято от суда - http://shpargalkablog.ru/2013/09/scroll-block.html#pr8 В демо, такой же скрипт работает гладко http://sticky01.blogspot.ru/2015/05/1.html
0 votes8 answers -
Как собирать HTML "налету"?
Как собирать статичную HTML страницу из нескольких HTML файлов "налету", но так, чтобы поисковик видел полную страницу. JS и iframe не пойдут... Или, другими словами, в HTML страницу вставлять информацию из другого файла.
0 votes6 answers -
Передача фокуса родительскому окну
window.opener.focus() - почему-то не работает (бывает возврат проскочит 1 раз из 10, а потом опять глухо!?...) Если в родительском окне задаю его имя window.name="rod", то из дочернего к нему не вернуться ("rod" - определение отсутствует)
0 votes8 answers -
Класс и стиль
Задать class и style для одного тега. Это, наверное, считается плохо?
0 votes14 answers -
display flex - в Firefox как то не так работает.
Есть вот такая конструкция.. http://jsfiddle.net/4376rfy8/3/ В IE, Google Chrome и Opera вроде работает, а вот в FireFox текст в левой колонке почему то съезжает вниз, методом тыка выяснил что скорее всего виноват display: table; в родительском контейнере. Но вот обойти этот глюк пока не могу придумать как((( Может кто сталкивался с подобным!? Что нужно в итоге: 1) левая и правая колонка одинаковой высоты с плавующей шириной 2) в правой колонке 4 блока которые центруются(выравниваются) по вертикали, причем верхний блок должен прилипнуть к потолку, а нижний к полу.
0 votes3 answers -
Мягкая тень вокруг li
Возник реальный вопрос. Png-прозрачность и все-такое уже умею. Не могу понять как сделать растягивающиеся кнопки с тенью через li. Вот пример:
0 votes17 answers -
Общий фон для нескольких элементов
Сдалал меню на списках, разложил элементы по горизонтали. Теперь вот хочу сделать один общий фон для всех элементов li. То есть использовать одну большую по длине картинку. Подскажите, как это можно сделать. Что-то я туплю… #main-menu { position: absolute; bottom: 45px; right: 0px; } #main-menu ul { display: inline; margin: 0; padding: 0; } #main-menu li { display: inline; margin: 0; padding: 0; } #main-menu a { font-family: Arial, Helvetica, sans-serif; font-size: 100%; background-color: #f1f1f1; background-image: url(../img/bg-menu-item.png); /* от этого можно отказаться в пользу общего фона*/ background-repeat: repeat-x; color: #555555; padding-left: 1…
0 votes5 answers -
Неизвестная ширина position: fixed
Добрый вечер. Возникла одна проблема: нужно реализовать фиксированное меню, у которого ширина зависит от ширины контента. Контент имеет минимальную и максимальную ширину, в случае последнего - выравнивается по центру экрана. Так же сам блок контента унаследовал отступы элемента body в размере 62px; Т.е как это все должно быть на изображении: -- Прописал блоку с position: fixed следующие: box-sizing: border-box;position: fixed;width: 100%;max-width: 1600px; // блок контентаheight: 100px;И все бы ничего, только если ширина экрана меньше 1600рх, то получается вот это: -- Помогите, пожалуйста, исправить p.s играл с положительным и отрицательным margin-ом и padding-ом, но в…
0 votes2 answers -
Баг с a > img (лишние отступы)
Обнаружил еще не понятный мне баг, который вылезает в ФФ, ОПЕРЕ и ИЕ если я внутрь тега A кладу IMG то если посмотреть на скриншот ссылка не облегает изображение визуально а просто как бы прилеплена к низу (см. скриншот, выделенным синим) + образуется еще непонятный отступ у а снизу! как пофиксить чтобы этих 2-х проьлем не было? пробовал overflow: hidden не помогло
0 votes22 answers -
Pixel Perfect для Mozilla 6.01
Здрвствуйте! При установке 6-ой Mozilla столкнулся с проблемой того что в ней не работает дополнение "Pixel Perfect"! Подскажите кто знает существует ли какой нибудь выход в данной ситуации? Возможно есть какая нибудь альтернативная программа для точной сверки положения макета относительно верстки! P.S. Буду признателен за любые ответы...
0 votes15 answers -
Нужна помощь со списком select
<div class="hidden-desktop"> <hr /> <select id="collapsed-navbar " class="content span12 collapsed-nav onchange="location.href=this.value""> <option selected="selected" disabled>Выберите пункт меню</option> <option class="page-home" value="">Главная</option> <option class="page-home" value="">Обратная связь</option> <option class="page-home" value="">Реклама на сайте</option> <option class="page-home" value="">Раздел</option> <option cla…
0 votes4 answers -
Отступ IE
http://myportfolio.ho.ua/4/ - пацаны не обращайте пожалуста внимания на кодировку, важен отступ между меню и контентом в IE как от него исбавиться ... я в поиске полазал сделал пару попыток ,оказались неудачными может подскажете чтото ? или ссылочки на темы похожие пожалуста
0 votes8 answers -
Бутсрап и список
В самом конце страницы есть список из 6ти пунктов. Ul я сделала как row, а пункты .col-sm-4 - на большом экране смотрится нормальн, но при сужении все ломается (мало того, что элементы списка криво выравниваются, так еще и внутри них текст на новую строку перескакивает, хотя там стоит 30 и 60% и border-box - что не так и как нужно? http://zverushka.zz.mu/edu9/
0 votes39 answers -
Ошибка в IE при верстке картинками
Помогите, пожалуйста, устранить баг. В IE над картинками menu_top и content_top появляеться полоса фона. Никак не могу прижать картинки к верхнему краю. В Firefox и Opera все работает отлично. Вот код: <!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> </head> <body> <table width="720" border="0" cellpadding="0" cellspacing="0"> <col width="195" valign="top"> <col width="525" valign="top"> <tr> <td style="background: #aff7fa" valign="top"> <img src="images/menu_top.jpg" style="pos…
0 votes3 answers -
Список внутри параграфа
Если я в html пишу: <p> <ul> <li>text</li> <li>text</li> </ul> </p> то когда открываю страницу в браузере получается: <p></p> <ul> <li>text</li> <li>text</li> </ul> <p></p> т.е. параграфы сами закрываются где не надо. Как сделать что бы работало нормально?
0 votes18 answers -
border и outline
Посмотрите правильно ли я понял. Вот когда пишешь свойство border, то рамка появляется вокруг содержимого, а когда пишешь outline, то рамка появляется внутри содержимого. Я правильно понял? Зелёный цвет это граница дива.
0 votes10 answers -
по-разному отображается страница
вот код страницы, которая требуется: ———————————————————————————————————— <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8"> <title>...::: Тестовая страничка. Почему по-разному отображается??? :::...</title> <style type="text/css"> html {width: 100%; height: 100%; padding: 0; margin: 0;} body {width: 100%; height: 100%; padding: 0; margin: 0; background-color: #dedede; font-size: small; color: #000000; font-family: Verdana, Arial, sans-serif; text-align: justify;} a:link, a:visited {color: #0000ff; text-decorati…
0 votes12 answers -
Две проблемы с тач-устройствами
Здравствуйте, коллеги! Столкнулся с двумя проблемами при тестировании верстки на ipad'е, прошу совета. 1. Допустим, на странице есть картинка-ссылка и скрытый блок с position:absolute, который в видимом состоянии перекрывает эту картинку-ссылку. При тапе на некий триггер блок становится видимым, при тапе на самом блоке он прячется. И вот когда происходит касание блока, открытого над картинкой-ссылкой, то не только блок прячется, но и ссылка активизируется, т.е. происходит переход по ссылке. Как побороть такое поведение? 2. Эта проблема совсем мистическая. Есть классическое выпадающее горизонтальное меню на ховерах. На ipad'е была проблема с однозначностью работы (нужно, ч…
0 votes5 answers -
Прилипание блока к видимым границам
Всем привет! Я тут новичок, не пинайте сразу если что. Требуется аналог position sticky для IE (в режиме совместимости с 7). Надо чтобы в одну строку текст с кнопками и с пунктирной линией проходящей под ними посередине в любой ситуации прилипал к левой и правой границе окна, то есть чтобы не участвовал в горизонтальной прокрутке, но прокручивался вертикально. Также при растягивании окна, текст за которым следуют кнопки находились слева на 20%. То есть если сдвинуть скролл, строка с красной полоской должна остатся на месте, если растянуть окно, то красная полоса растягивается, "( Title )" немного сдвигается вправо. Надеюсь более менее объяснил, за…
0 votes12 answers -
Как зафиксировать элемент относительно окна браузера
Здравствуйте, есть такой код: <html> <head> <style type="text/css"> body { margin: 0; padding: 0; width: 100%; color: WindowText; } #header { width: 100%; padding: 0.5em 0; background-color: ButtonFace; color: ButtonText; position: fixed; bottom: 0; left: 0; //position: absolute; bottom: expression( document.getElementsByTagName( 'body' )[0].scrollBottom + "px" ); } #content { background: Window url('grid-10.gif'); padding: 2.2em 0; width: 100%; height: 3000px; } </style> </head> <body> <div id="header">Top Frame Content</div> <div id="content"> …
0 votes3 answers -
Прозрачная картинка...
В продолжение этой темы... Выключаю все слои, кроме того, что с нужной прозрач. картинкой (он серый и прозрачный), выделяю прямоугольным выделением, копирую с содержимым, вставляю в новый документ и сохраняю для Web и устройств в PNG... В итоге получаю непрозрачную картинку!! ( Что не так?? Как же добиться прозрачности??
0 votes28 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
Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
-