Jump to content

HTML Coding

Subforums

  1. Discussion of works

    Source code audit and recommendations

    30.1k
    posts

  2. Practise Templates

    Templates for self education and practise

    1k
    posts

Explore Questions

There are no popular questions to show right now

  1. Вёрстка футера на движке Xenforo

    Asked by Mondeus,

    0 votes
    0 answers

  2. Примеры верстки

    Asked by torsar,

    0 votes
    0 answers

  3. Список покидает див

    Asked by DeZ,

    0 votes
    0 answers

  4. Проблема с шириной ячеек

    Asked by ArrogantSpectator,

    0 votes
    1 answer

  5. Html кнопка

    Asked by НикитаL,

    0 votes
    3 answers

29,542 questions in this forum

  1. Размещение блоков с контентом

    Здраствуйте! Хотел бы узнать у вас, как делается подобный макет? Что мы имеем? (1) "Подложка" фиксированной ширины(по центру экрана) на которой размещаются контейнеры с контентом (2) Несколько блоков на "Подложке", а именно: Шапка, меню, два-три контейнера под меню(Там Мб личный кабинет, теги и тп), 5-7 контейнеров, расположенных справа от меню, в которых предпологается размещение новостей, подвал под всем этим делом ( Забыл нарисовать, но да ладно, с ним не возникает проблем) Итак, вопрос, как грамотнее всего реализовать данный макет? У самого были такие варианты: - с помощью position:fixed(left, top, right и bottom) попытаться все эти блоки разместить на "подложке". …

    Asked by OlegLont,

    0 votes
    3 answers

  2. yandex опять пустое место показывает! как починить?

    Приветствую, Вроде получалось победить яндекс, не было пустого места слева, причём мне этот способ подсказали в техподдержке яндекса. но на днях способ просто перестал работать. а техподдержка молчит. css для яндекса у меня: первые две команды - убрать привязку строки поиска - работает и сейчас, но третья строка раньше убирала пустое место слева. сейчас она ничего не делает. .b-head-floater_fixed_yes{display: none;} .b-scroll{display: none;} .b-page-layout__column-proxy {margin-left: 0 !important} я пробовал найти, что отвечает за появление прорехи и нашёл - смотреть вложенный рисунок. но - не получается переопределить. как мне переопределить для яндекса .b-serp-item { …

    Asked by tte,

    0 votes
    5 answers

  3. Как можно разместить по горизонтали несколько картинок ?

    Как можно разместить по горизонтали несколько картинок ?

    Asked by Saturn,

    0 votes
    11 answers

  4. Как убрать вертикальный скролл если высота 100%

    Добрый день! Второй день мучаюсь не могу найти ничего по данной проблеме! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html> <head> <title>test</title> <style> html, body { height: 100%; widht: 100%; padding: 0; margin: 0; } .wrap{ height: 100%; width: 100%; padding: 0; margin: 0; position: relative; } .header{ height: 50px; width: 100%; background: blue; } .content{ height: 100%; min-height: 100%; padding: 10px 0; width: 100%; background: yellow; } .footer{ display: table-row; height: 30px; width: 100%; background: re…

    Asked by pati,

    0 votes
    3 answers

  5. два div'а одинаковой высоты

    Понимаю что тема уже избита, но всё же. У меня есть два div'а, у одного "float:left", другой просто обтекает + они завернуты в общий блок div. Цвета фонов разные, причем у левого есть ещё рамка. Не получается сделать высоту одинаковым. Ставил обоим div'ам "display:table-cell", но и тут без проблем, если например сделать у одного из div'ов "padding:20px", то и у второго тоже "padding" становится 20px, а мне не надо так. Помогите люди добрые)

    Asked by dirtez,

    0 votes
    3 answers

  6. Div поверх gmap

    Вобщем есть картинка, которую нужно разместить поверх гугл-карты. Z-index не помог. Есть ли способ? Привожу код страницы: <!DOCTYPE html "-//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>Гугокарты</title> <script src="http://maps.google.com/maps?file=api&v=2&key=abcdefg" type="text/javascript"></script> <script type="text/javascript"> function initialize() { if (GBrowserIsCompatible()) { var map = new GMap2(document.getElementById("map")…

    Asked by Lakrein,

    0 votes
    11 answers

  7. Валидация w3c

    При валидации на w3c заметил ошибку: Line 9, Column 36: The align attribute on the div element is obsolete. Use CSS instead. <div id="page-wrap" align="center"> Когда align переношу в CSS выходит такое: #page-wrap Свойство align не существует : center center Как правильно сделать, что бы пройти валидацию? index.html <!DOCTYPE html> <html> <head> <title>Лестница</title> <meta http-equiv="content-type" content="text/html;charset=utf-8"> <link rel="stylesheet" type="text/css" href="./css/style.css"> </head> <body> <div id="page-wrap"> <img src="./images/circle.png" alt="logo"> </di…

    Asked by klanessia,

    0 votes
    4 answers

  8. Всегда по центру, справа и слева рисунки

    Есть проблема на http://www.belva.ru/catalog/razdel/kabinety_palaty_posty/ Внизу под меню есть фильтр, не получается сделать его посередине и чтобы округлости были побокам. Не подскажите с этим справиться? Битый час уже извращаюсь.

    Asked by Tchorteg,

    0 votes
    6 answers

  9. Кнопка твитер

    Добрый вечер! Как добавить вот эту кнопку в правом нижнем углу слоя?

    Asked by mylogin,

    0 votes
    13 answers

  10. Проблемы с сочетанием css свойств position,overflow и white-space в Opera

    Здравствуйте! Написал небольшой скрипт для слайдшоу. Для примера: Есть список состоящий из 7-ми изображений: <div id="galery"> <div class="previous"><a href="#">Назад</a></div> <div class="container"> <ul> <li><a href='anketa.php?id=1&name=anketa1'><img class="anketa" src="img/1.jpg" /><img class='newMessage' src='img/newMessage.jpg' /></a></li> <li><a href='anketa.php?id=1&name=anketa2'><img class="anketa" src="img/2.jpg" /><img class='newMessage' src='img/newMessage.jpg' /></a></li> <li><a href='anket…

    Asked by Adel1ne,

    0 votes
    0 answers

  11. Небольшие проблемы с полем ввода

    Здравствуйте, есть небольшой вопрос по стилизации формы ввода, а точнее ее placeholder. Возникли разногласия между браузерами (причем даже между Chrome и Safari хотя они же вроде оба на одном движке). Placeholder задан в html разметке у поля input, хочу поменять его цвет - полазив по просторам интернета, пишу следующее: #search_field ::-webkit-input-placeholder { color:#222; } #search_field input:-moz-placeholder { color:#222; } Итог: 1.Firefox - все как надо 2.Safari - все как надо (кроме того что при фокусе, пока не начнешь вводить сам текст, placeholder не исчезает, может кто знает как и это решить, был бы очень признателен) 3. Chrome - другой цвет placeholde…

    Asked by kuyn,

    0 votes
    8 answers

  12. Как сделать рамку из текстуры?

    Возникла необходимость сделать рамку вокруг div'а, примерно вот так: http://miron.in/images/untitl-1319037614.png Различие в светлых и темных градациях серого можно отбросить, главное сам смысл - текстура с повторяющимся рисунком, обрамляющая блок. Проблема в том, что высота блока заранее неизвестна. Немного подумав (и погуглив) решил попробовать вариант с четыремя вложенными div'ами, каждый из которых можно залить такой текстурой и поставить по периметру. Но тут возникнет другая проблема - ведь текстура может и не совпасть. Еще читал про border-image, но он в IE вообще не работает. Что можно попробовать в такой ситуации?

    Asked by zusicks438,

    0 votes
    8 answers

  13. Интересная ситуация

    Здравствуйте, я записался на курсы веб- программиста при институте(html и php), до этого прочитал несколько книг по html и css. Но тут прийдя на курсы я узнаю по словам препода : существует много типов html. И он короче начал свою первую лекцию с того какие тэги бывают, две вещи которые меня удивили: 1)тег <b> - РАЗДЕЛЕНИЕ НА АБЗАЦЫ! 2)Он описал структуру веб страницы как: 1)<title> 2)<body> 3)<hard>-че за тег? 4)<index><follow>-че за теги? Можете объяснить что он вообще преподает? Я в недоумении... Кроме того он дал две ссылки на которые я еще не заходил: http://ckeditor.com/ http://www.tinymce.com/ ЗЫ Ах да, он часто произносил: "это…

    Asked by fragilewelldone,

    0 votes
    6 answers

  14. RSS не отображается в браузере

    Всем привет! У меня такая проблема: не отображается rss в браузере в том месте, в котором он должен быть. Браузер просто его не замечает (ни один из rss, даже со сторонних ресурсов), хотя все вроде написано верно: <!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>XXX</title> <link rel="alternate" type="application/rss+xml" title="Форум htmlbook.ru RSS" href="http://forum.htmlbook.ru/index.php?app=core&module=global&section=rss&type=blog"> </head> Если кто знает в чем причина сообщите плз. Буду очень признателен за помощь.

    Asked by topwizard,

    0 votes
    4 answers

  15. Фон списка внутри абзаца отличается от фона абзаца

    Привет! ul, ol, li { margin: 10px; padding: auto; } #right #content p { text-align: justify; margin-top: 15px; padding: 15px 100px 15px 15px; line-height: 1.5; background: #eee; } #right #content p:hover { background-color: #cce; color: #444; } #right #content p:first-letter { font-size: 160%; font-weight: bold; color: #c11; } Абзацы выходят нужного фона, но фон у списков в абзацах белый. В чем дело?

    Asked by kuraga,

    0 votes
    9 answers

  16. Автоматическое заполнение diva блоками, следующими слева на право

    Доброго времени суток Уважаемые Гуру верстки! Столкнулся с необходимостью автоматически заполнить блок контентом в несколько столбцов. Как здесь: Каждый блок контента принадлежит к одному классу, у каждого фиксированная ширина, а высота разная. Применив float-left блоки заполняют пространство слева направо, но получается разрыв по высоте: Как решить данную проблему? Вот код для примера: <!-- #oblogka { background-color: #C9F; height: 300px; width: 200px; position: relative; } .content { background-color: #CCC; float: left; height: auto; width: 90px; border: 1px solid #00C; } --> </style> </head> <body> <div id="oblogka"> <…

    Asked by tragbang,

    0 votes
    6 answers

  17. Как можно обратиться к родителю в CSS ?

    Как можно обратиться к родителю в CSS ? В такой структуре : <li> <div class="author"></div> </li> Хочу сделать рамку, а как обратиться к li c класса не пойму ?

    Asked by Saturn,

    0 votes
    4 answers

  18. placeholder в Opera

    Всем привет В общем, есть проблема: использую собственный шрифт @font-face в input-е строки поиска, внутри указан placeholder тем же шрифтом. Во всех браузерах приемлемый результат, кроме Оперы. Опера, цука, во фразу placeholder-а вместо пробелов тулит "неизвестный науке" символ - "знак вопроса в прямоугольничке". И этот же гадский знак вопроса выскакивает в самом инпуте, если хомячок в поисковой фразе пишет несколько слов. Символ этот — не есть пробел, и не есть неразрывный пробел. Шрифт оптимизирован для загрузки, лишние символы выброшены. Нужно найти недостающий - именно тот, который юзает Опера. ЧТО это за символ такой? Идеи есть, как его выловить? ЗЫ: Дефолтный/систе…

    Asked by abused,

    0 votes
    0 answers

  19. Вертикальные вкладки справа

    Всем привет! У меня в Друпале по умолчанию горизонтальные вкладки используются. Хочу css'ом их превратить в вертикальные, но вот как их позиционировать? <div родитель> <div вкладки> <div контент> - именно к этому блоку справа нужно прижать вкладки </div родитель> пробовал position:absolute, но у меня сайт с резиновой серединой и двумя боковыми фиксированными блоками. То есть окно уменьшаешь и все плывет. Как можно спозиционировать? Спасибо!

    Asked by otmoroz095,

    0 votes
    1 answer

  20. box-shadow не проходит валидацию

    Здравствуйте. Пытаюсь приобщиться к CSS3, но не могу пройти валидацию. Имеется код: .box-shadowed {box-shadow: 2px 3px 4px 2px #888;} W3C ругается: Ошибка разбора [empty string]. Если убрать растяжение тени, то все ок, но тень растягивать мне нужно .box-shadowed {box-shadow: 2px 3px 4px #888;} Это баг w3c парсера или я что-то делаю не так? Если указать любой из параметров тени как ноль без размеров - тоже ругается. .box-shadowed {box-shadow: 0 0 4px #888;}

    Asked by hedgehog,

    0 votes
    3 answers

  21. Позиционирование выпадающего меню

    Здравствуйте! Помогите пожалуйста: 1. сайт _hххp://aktivsport.com.ua меню слева категорий сделано в виде выпадающих подкатегорий, в случае если пункт меню находится возле нижнего края экрана то подкатегории уходят за нижнюю границу экрана, а нужно что бы они в этом случае открывались как бы "вверх". 2. сайт _hххp://nkt.ua в шапке присутствует вывод валют комбобоксом, в ФФ он отображается а в ИЕ его не видно Прошу помощи, помогите пожалуйста

    Asked by SKM,

    0 votes
    0 answers

  22. Как постепенно делать бекграунд невидимым ?

    Вот у меня бекграунд резко заканчивается там, где заканчивается контент. В принципе картинка плавно переходит в фон, но когда контента много. А когда мало - вот такая четкая граница, как сделать чтобы фоновая картинка внизу плавно исчезала, независимо от количества контента ?

    Asked by kpripper,

    0 votes
    6 answers

  23. Проблема с печатью документа

    Здравствуйте. Опишу вкратце ситуацию. В общем есть биллинг.(может кто знает UTM5). В нем все документы, которые печатаются из него редактируются на html. Редактируются прямо в окне самого биллинга. И просматривается результат там же. Оформляю шаблон договора в биллинге. Вроде все нормально сделал, но появляется проблема при печати. Некоторые слова в тексте либо наслаиваются друг на друга либо становятся без пробела. При предварительном просмотре такой проблемы не видно. Только при печати на листе бумаги. Плюс ко всем открыл код html в отдельном файле через браузер - при печати на странице такой проблемы нет. Подскажите в чем может быть проблема? Спасибо.

    Asked by dovzz,

    0 votes
    0 answers

  24. Помогите пожалуйчта я навечек с ссылкой в div

    столкнулся с проблемой, я новичек, при использовании div не все ссылки в некоторых браузерах работают корректно, из 8 только 3 появляются ( в опере все работают в гугл хроме несколько... помогите разобратся с кодом, что бы правильно отображал, все перепробовал , мозги кипят, вот он сам код #test0{ position:absolute; top:100px; left:130px; width:160px; height:400px; border-style:solid; border-width:5px; border-color:#EEE9E9; } #test2{ position: relative; bottom:0px; left:0px; border-style:solid; border-width:0px; border-color:#EEE9E9; } #te…

    Asked by memb,

    0 votes
    7 answers

  25. Не работают стили для div

    Есть div-елемент вроде хедера . В нем задан фон(картинка) . Внутри этого елемента должно быть еще 4-и елемента (переключатель(разделитель)страниц и три тега <p>) Кадый едемент я взял в div и задал ему стиль. И так сам корневой div отбражается коректно(имеет position:reletive;) , пока в него не вставить другие . После этого он сежджает немного вниз. В это время сами елементы (те которые внутри) имеют значение position:fixed; Чтобы корневой div не сежджал в низ ему тожэ присваеваю position:fixed . Но тут другая проблема. Весь контент снизу начинает его перекрывать. Чтобы исправит это , делаю поверх него пустой div с position:reletive . Но снова неудача так как пустой …

    Asked by Vandeko,

    0 votes
    2 answers

  • Обсуждения

    • Mondeus
      Вёрстка футера на движке Xenforo

      By Mondeus · Posted

      Доброго всем времени суток. Прошу помощи. Научите принципу изменения футера. Движок 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 } }  
    • torsar
      Примеры верстки

      By torsar · Posted

      Нужны сайты с примерами верстки, типа https://css-tricks.com/. Типовые приемы и нестандартные на все случаи жизни. Накидайте ссылок.
    • Katerina23
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Katerina23 · Posted

      Да, подходит. Спасибо.
    • Switch74
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Switch74 · Posted

      <input type="number">
    • Katerina23
      Какой тег использовать, чтобы увеличивать число кнопками вверх-вниз?

      By Katerina23 · Posted

      Здравствуйте, подскажите какой тег использовать для увеличения значения, пример на картинке. Вроде, про такой тег я слышала. Если есть тег прогресс бар, значит и такое должно быть.
    • DeZ
      Список покидает див

      By DeZ · Posted

      Решение нашел.  Заменил на  Всем привет. Список выходит из дива. При этом, другие элементы в диве отображаются корректно. Не могу найти причину. Нужно чтобы список был под кнопкой ПЛЕЙ...          
    • AIek
      ищу клиентов,услуги

      By AIek · Posted

      Здравствуйте! Мы команда программистов с многолетним опытом разработки. Работая с нашей командой, Вы получаете порядок условий и развитие с обеих сторон: разработка проекта и продолжение сотрудничества на долгосрочной основе, так же специалисты всегда готовы предложить различные идеи и дополнения.  Разрабатываем проекты любой сложности: скрипты для автоматизации рутины, боты, сайты, админ панели, ico, ldo, разработка криптовалюты, смарт контракты, приложения, игры. Ответственность, качество, соблюдение дедлайнов - это про нас!  Наш контакт:  https://t.me/MadFury (https://t.me/madfury) (TG) TG:  https://t.me/2e7.io Сайт: https://code-r.io/
×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy

  I accept