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
-
Как задать максимальную ширину блока, чтобы блок растягивался до этой ширины в зависимости от длины текста внутри него
Вот пример: http://cssdeck.com/labs/gt43peto Есть блок, внутри него текст. Каждое слово переносится на новую строку. Как задать максимальную ширину блока, чтобы блок растягивался до этой ширины в зависимости от длины текста внутри него. Если текст длиннее максимальной ширины блока, то только тогда текст должен переноситься на новую строку. Если текст короче максимальной ширины блока, то блок должен быть такой же ширины как текст + отступы.
0 votes7 answers -
скругление-эллипс нижних углов блока
Ребят,нужна помощь нужно сделать у блока со слайдером скругленные нижние углы,но скругление эллипсовидное проблема в том что когда задаю border-radius: 0 0 50%/5%; - скругляется нижний правый угол но если задать border-radius: 0 0 50%/5% 50%/5%; - то блок остается квадратным https://jsfiddle.net/1ndr2qq1/
0 votes2 answers -
Хитро убрать pointer-events со ссылки и вернуть обратно
Добрый день. Такая задача. В оформлении текста используются невидимые блоки - span.show-on-hover, где color = background-color и где color становится контрастным по .show-on-hover:hover. Вместе с текстом прячутся ссылки и показываются по .show-on-hover:hover a. Всплыла проблема с мобильными пользователями. Чтобы увидеть текст блока, они в него тыкают. Порой они ненароком попадают в невидимую ссылку и тотчас переходят по ней. Нужно чтобы по ссылке невозможно было перейти с первого тапа, первый тап должен только кинуть :hover на .show-on-hover, и только вторым тапом можно тапнуть по ссылке. При этом для пользователей компьютеров все должно быть по-прежнему, никаки…
0 votes6 answers -
помогите правильно определить селектор
часть html: <body class="front two-sidebars"> ... <div id="main"> ... </div> </body> в css файле прописано: .two-sidebars #main { background: url(image.png); } Вопрос: как правильно прописать селектор в css для #main, чтобы он обрабатывал такие конструкции: желательно чтобы не прописывать "sameclass" "samaeclass2" и т.д. в css файле, а выбор был основан только на ".two-sidebars #main"
0 votes6 answers -
Не Получается Сделать Нормано Подвал
Вот не как не могу сделать нормальное отображение подвала страницы... Сама затея состоит в том, чтоб с помощью позиционирования вывести центральную колонку вывести первой в html коде страницы, получилось все отлично. Но дальше наткнулся на БОЛЬШОЕ НО это нормальное отображение подвала страницы. ПОМОГИТЕ СДЕЛАТЬ ПОДВАЛ вот пример: <!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">…
0 votes3 answers -
Несколько вопросов начинающего
Добрый день! Осваиваю html, сейчас тег form прохожу. Вопрос в следующем: атрибут action выполняет какие-либо действия по нажатию кнопки Submit, так? Я правильно понял, что создавая внутри одного тега form несколько submit'ов, я толком ничего не имею? Все равно по нажатии любого из них будет выполняться то, что написано в action, то есть переход на Google в данном случае? Пример. <form action="http://www.google.ru"> <p>Name<br /> <input type="text" /></p> <p>Password<br /> <input type="password" /></p> <input type="submit" /><p> <input type="checkbox" name="vybor" value="v1"/>Opera<br> <input…
0 votes7 answers -
Проблема с "отталкиванием" блока
Вот такая проблемка. При увеличении блока left не отталкивается блок bottom. все это находится в блоке контент (футер отдельно), вот коды : <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <link rel="stylesheet" type="text/css" href="css/template.css"/> <title>Заготовка_под_сайт_универсальная</title> </head> <body> <div id="header"> </div> <div id="menu"> </div> <div id="container"> <div id="content"> <div id="left"> …
0 votes4 answers -
Подключение своего шрифта
Хочу на сайте использовать шрифт "aparaj", он вроде бы не лицензионный и нормально конвертируется. Но сам шрифт состоит из 4 частей - обычный, жирный, курсив и жирный курсив, то есть 4 файла шрифта. Шрифты конвертировал на onlinefontconverter.com Подключаю шрифт к сайту вот так: @font-face { font-family: Minion Pro; src: url("../style/minion_pro_or.eot?") format("eot"), url("../style/minion_pro_or.woff") format("woff"), url("../style/minion_pro_or.ttf") format("truetype"), url("../style/minion_pro_or.svg#svgFontName") format("svg");}Как мне подключить шрифт если он состоит из 4 частей? В примере использую шрифт "Minion Pro", он норма…
0 votes14 answers -
Помогите
У меня есть макет .Проблема вот в чем я не знаю как сверстать шапку(шаблон фиксированный) тоесть я фон то могу отобразить правильно,но логотип и баннер не знаю как сверстать никак не встают так что бы логотип слева баннер справа.Не могу сообразить как сверстать... Помогите.Пробовал фон делать релатив а логотип с баннером на обсолют,но так фон съезжает да и получается не под все разрешения экрана. Вот код фона шапки <table style="width: 100%; border-collapse: collapse"><tbody><tr><td style='width: 1100px; height: 174px; letter-spacing: 0px; word-spacing: 0px; background-image: url("http://nek.3dn.ru/images_shw/shapka_bg.png"); background-repeat: no-r…
0 votes13 answers -
a:hover Убрать подсвечивание
Для ссылок задано свойство подсвечиваться при наведении курсора /* line 104, ../../../../../../ekkl/scss/app.scss */.top-bar-section li:hover > a { background-color: #3e78b2;}Нужно убрать подсвечивание, если ссылка находится внутри контейнера .regform
0 votes8 answers -
Где находить сайты правильно с верстанные чтоб можно было смотреть у них как сделано ?
Можете подсказать сайты хорошо сверстанные чтоб можно было смотреть как у них сделаны те или иные элементы.
0 votes2 answers -
Глубокое (3-4 уровня) меню на мобильных устройствах
День добрый! Друзья, возник вопрос. На сайте есть глубокое меню: Каталог - Оборудование 1 - Модель 1 - Тип 1 - Тип 2 - Тип 3 Реализовать такое для десктопа легко: тут есть и клик и ховер. А вот как быть с мобильными устройствами??? При клике вместо выпадающего подменю открывается ссылка на раздел Модель 1. Из-за этого подменю, где указаны Типы (1,2, 3) не открывается вовсе. Я понимаю, что эти типы можно реализовать иначе, например через фильтр в разделе Модель. Но нужно именно такое глубокое меню! Как быть, подскажи, пожалуйста. Заранее спасибо!
0 votes6 answers -
(не)применение стилей к спискам
Здравствуйте! У меня вопрос, наверно оч. простой и наивный. В стилях для списков на сайте убраны маркеры UL { list-style: none; } Но в одном списке на сайте эти самые маркеры все же должны быть. Как для этого списка "отказаться" от общего стиля? Спасибо
0 votes8 answers -
ЫЫЫ вешаюсь
в общем верстаю дивами.. надо же учиться когда-нибудь этому... столкнулся с таким косяком: в IE все в порядке, а в FF плющит... index.html http://kot9lpa.jino-net.ru/1/ тут можно посмотреть <!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=windows-1251"> <title>BEMANI-TITLE</title> <link rel="stylesheet" type="text/css" href="bemani.css"> </head> <body> <div id="main" align= "center"> <div id="parent"> <div id="shapka"> <div id="shapka1">d</div><div id="shapka2">d<…
0 votes6 answers -
Нужно резать строку без пробелов
Проблема следующая: выводится одна очень длинная строка без пробелов и символов перевода строки. Она выходит за край блока, в котором лежит. Нужно как то блоку этому показать, что строка должна переноситься. FF3 это сам делает, IE понимает word-wrap: break-word; а для FF2 ничего найти не смог.
0 votes4 answers -
Проблема table как фон
Доброго времени суток Для оптимизации и ускорения загрузки сайта я порезал большие картинки на куски и склеил их с помощью таблицы вот что получилось для примера и понятия <table id="________01" width="1000" border="0" cellpadding="0" cellspacing="0"> <tr> <td> <img id="img_header_01" src="{THEME}/images/img_header_01.jpg" width="125" height="69" alt="" /></td> <td> <img id="img_header_02" src="{THEME}/images/img_header_02.jpg" width="125" height="69" alt="" /></td> <td> <img id="img_header_03" src="{THEME}/images/img_header_03.jpg" width="125" height="69" alt="" /></td> <td> &l…
0 votes8 answers -
0 votes2 answers
-
Иконка для полей ввода
Здравствуйте, форумчане! Верстаю сайт и озадачился таким вот вопросом. Позволю себе предысторию... Сейчас модно делать иконки у полей ввода (поиск, пароль, адрес почты и т.д.), которые визуально показывают тип информации, которую в них следует ввести. Обычно это легко делается, через свойство тега background. Но мне почему-то показалось, что некрасиво, когда при наведении на эту иконку курсор остается "в режиме ввода текста" (ну вы поняли...), он имеет вид, как-будто его навели на поле ввода и не меняется. Я подумал и решил, что надо сделать так: Вначале html-код: .... <div id="searchWrap_lvl2"><input type="text" name="search_field" id="search_field" value="По…
0 votes8 answers -
Горизонтальная прокрутка товаров и эффект при наведени
Добрый день! Имеем горизонтальный блок товаров с прокруткой: Но при наведении необходимо добавлять в каждый товар какой то текст (его свойства), и этот блок должен показываться поверх прокрутки, полностью. Как это можно реализовать? Ведь если задать общему div: overflow-x: scroll; То div, на который мы навели, будет обрезан, либо увеличен размер внешнего тега div, что недопустимо, он должен быть всегда одной величины.
0 votes2 answers -
bootstrap3: переход на одну колонку
помогите пожалуйста решить проблему на страничке есть 2 кнопки: .but1, .but2 . при изменении ширины экрана они меняют своё расположение друг относительно друга. при белом и жёлтом бэкграунде они расположены в одну колонку, при magentа и cyan бэкграунде они расположены в 2 колонки у меня не получается сделать так чтобы при белом бэкграунде они располагались в одну колонку, а при жёлтом, magenta и cyan бэкграунде они располагались в 2 колонки цвет бэкграунда соответствует дефолтным точкам перехода в бутстрапе: @media (min-width: 480px) { body{ background: orange !important; }}@media (min-width: 768px) { body{ background: magenta !important; }}@media (min-width: 992p…
0 votes10 answers -
В IE6 в стилях не работает тег BODY
Приветствую. Ситуация следующая: Создаю встроеную таблицу стилей, например: <html> <head> <style type="text/css"> <!-- BODY { background-color: #99653e; color: #f0f; } --> </style> </head> <body> текст </body> </html> Вс? прекрасно работает в IE 6, однако стоит вынести таблицу стилей в отдельный файл как тег BODY в IE 6 переста?т работать (все остальные теги работают нормально а вот BODY не работает) в Opera все теги работают нормально. Подскажите, так ли это или я в ч?м то не прав, В ч?м ошибка и как исправить? Вот листинг раздельных html и css: <html> <head> <link rel="stylesheet" type="text/css" hre…
0 votes4 answers -
И опять про height:100% в IE
Есть вот такой код: <!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=windows-1251"> <title>test</title> <style type="text/css"> <!-- body, html { margin:0; padding:0; height:auto !important; height:100%; } #topdiv { height: 40px; width: 100%; } #leftdiv { width: 300px; left: 0px; top: 40px; bottom: 0px; position: absolute; background-color: #00CC99; overflow: scroll; } #rightdiv { position: absolute; left: 300px; top: 40px; right: 0px; bottom: 0px; background-color: #09C; } --> </s…
0 votes3 answers -
отправка переменной с одной страницы и вывод ее на второй странице средствами HTML
народ выручайте.. допустим есть страница index1.html на ней форма ввода имени... после ввода имени оно должно перейти на страницу index.html и нужно вывести ее в некотором поле... в форме index1.html ИМХО метод передачи POST и поле ввода имени и кнопка... в index.html имеется строка "Ваше имя:"... плиз срочняк нужно...
0 votes7 answers -
Помогите..please
Здрасте..помогите пожалста.. почему у меня такая лажа получается, пришу посты на блоге табличку там использую..но у меня какой то большой пробел перед текстом и картинками образуется...почему, что не так? вот адрес блога http://www.happynight.ru/ а в постах вот такой код: <table> <tr> <td aligh="center" valign="top" ><img src="..." height="350" width="240"> </td> <td aligh="center" valign="top" ><img src="..." height="350" width="240"> </td> </tr> <tr> <td colspan="2" aligh="center" valign="top" height="60" width="80"> «бла бла бла.... </td> </tr> <tr> <td aligh="left" valign="top" >…
0 votes5 answers -
Накладывается скрытый слой на кнопки формы
Сделал форму, в которой при выборе radio, открывается div. Но этот div накладывается на кнопки формы. Подскажите, где недоглядел. <div id="firstdiv"> <div id="Scr1" class="hidden" > 1ый блок спрятанный </div> <div id="Scr2" class="hidden" > 2ой блок спрятанный </div> </div> <input type="submit" class="buttons" value="Записать" /> <input type="reset" class="buttons" value="Очистить" /> #firstdiv {position:relative;} #Scr1 { position:absolute; } #Scr2 { position:absolute; }
0 votes13 answers