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. Верстка блока

    Добрый день форумчане, сразу говорю что в html и css я чайник, собственно и создал тут тему дабы получить ответ, а не "иди юзай гугл" и "учи учебники". А вот и проблема: Создал я в PS фон блока, разделил его на 3 части и сохранил, создал DIV с классом: <div class="box"></div> затем описал класс: .box{ border:1px solid #000; width: auto; height: auto; margin:10px auto; background:url('../image/Верхняя часть фона.png') no-repeat center top; background:url('../image/Средняя.png') repeat-y center; background:url('../image/Нижняя.png') no-repeat center bottom; } и как я думал у меня получится фон блока соединённый из 3 частей...но к сожалению ничего не вышло...ка…

    Asked by kamaz6141,

    0 votes
    9 answers

  2. Верстка блока

    Доброй ночи ! Ребята подскажите, как правильно сверстать этот блок ? 1) Можно было бы сохранить все кроме робота-пылесоса, но потом нельзя применить z-index. 2) По отдельности сверстать тоже не вариант, потому что блок 960px, все получается маленькое, из-за того что в макете блок имеет ширину 1920px Как быть ???

    Asked by Omega24v,

    0 votes
    2 answers

  3. Верстка блока для сайта

    Требуется: Верхнее оранжевое изображение разделить на 3 части. Т.е. по краям фиксированная ширина по 10 px а посередине background 1 px который растягивается по заданной ширине. Нижняя рамка тоже из трех частей, фиксированный верх и низ а середина тянется. Между двумя объектами должно быть расстояние 3 px. Как это все грамотно сделать в CSS ? И что должно быть в HTML файле? Помогите новичку, уже голова кругом...

    Asked by Kilo,

    0 votes
    8 answers

  4. Верстка блока номера страницы

    Ребят как одним дивом (кросбраузерно) например сделать такое, чтобы тянулось по ширине: <div class="number">10</div> Тянется только белый блок вокруг номера страницы с округлыми краями.

    Asked by okunev2,

    0 votes
    12 answers

  5. верстка блока с иконкой и рамкой, и текстом внутри

    Здравствуйте. Подскажите начинающему, как правильно сверстать блок такого плана Скрытый текст (смотри рисунок) , когда по периметру идет граница, а на верху блока иконка возле которой границ нет, но потом есть. Попробовала все это сделать через background.. но не знаю, на сколько это правильно. Ну и хочу, чтобы все это адаптивно было. И как правильно верстать вот такое дерево блоков?

    Asked by Prana,

    0 votes
    4 answers

  6. верстка блока с линками на div

    Направте на путь истинный, пожалуйста. Пробую учится css верстке. Проба изложена ниже. Проблема в том, что в блоках не работает декорирование текста. Работают эффекты но шрифты имеют стандартный цвет линка и подчеркнуты. text-decoration: none; не реализуется. Не имеет значение какой шрифт подключается. Помогите разобраться, пожалуйста. Заранее спасибо. скрин проблемы: http://yadi.sk/d/iyjI6prs01eZQ вот код 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=utf-8" /&g…

    Asked by nvic,

    0 votes
    1 answer

  7. Верстка блока статистики

    Как сверстать эту секцию? Возможно, вы знаете подходящую js библиотеку? Спасибо!

    Asked by Hasiev,

    0 votes
    6 answers

  8. верстка блока, который появляется только при наличии более 3 заголовков

    Уважаемые Гуру форума, как всегда спешу порадовать своей проблемкой и надеюсь на помощь в ее решении... Проблема состоит в следующем, делается шаблон под dokuwiki и там опционально имеется блок который появляется только при наличии в тексте 3 и более заголовков. проблема состоит в том что нужно хитро сверстать как на скриншоте и при этом что б оно не отображалось если менее 3 заголовков... Проблема наглядно: Скрин как должно быть Пример где 3 и более заголовка Пример где менее чем 3 заголовка Скрин где видно, что не пропадает даже если ставлю просто background: #FFFFFF;, а сделать нужно еще тени и округлости, которые корректно получаются только картинками на background …

    Asked by beliy,

    0 votes
    8 answers

  9. Верстка блоками

    В общем, не так давно я занялся сайтами, и в чем-то уже преуспел. Вот решил освоить верстку блоками, и столкнулся с такой проблемой, у меня есть картинка (сам сотворил),ее я разбил на 5 частей и их надо собрать вместе: вот план сборки http://s42.radikal.ru/i098/0808/41/4defafb3dd62.jpg В табличной верстки это я делал так http://stars124.narod.ru/1.html (работает во всех браузерах) А как это сделать в блочной я пока не знаю ((( вот сделал пробно http://stars124.narod.ru/2.html (В опере вроде нормально, в остальных браузерах все расплывается как черт знает что) Еще интересует как мне вот эту блочную сборку, выровнять по центру экрана. Собственно блоки начал изучать вот толь…

    Asked by stars,

    0 votes
    12 answers

  10. Верстка блоки разной высоты

    На этом странице есть разделы "Способ доставки" и "Способ оплаты". Сверстал их таблицами. Думаю самый оптимальный вариант в этом конкретном ситуации. Но проблема в том , что , заказчик требует что было возможность динамически изменять , тоесть добавлять и удалять пункты через админки, без влезании в исходный код. Так как, тут, одной удалении td недостаточно, каким еще другим способом можно сверстать такой раздел? чтобы место удаленного пункта заменил преследующий его пункт? Спасибо!

    Asked by parnas,

    0 votes
    2 answers

  11. Верстка блоков

    Всем привет! Помогите разместить этот красный прямоугольник внизу где проблем между серым: http://img686.imageshack.us/img686/2708/80596290.jpg Ниже код с шапки <div id="header"><div id="grekovlogo"><div id="grekovtext"><h2>ГРЕКОВ</h2></div></div><div id="bar"></div></div> #grekovlogo { background-color: #000; width: 207px; height: 84px; float: left; } #grekovtext { padding: 15px 45px; float: left; } #bar { background-color: red; width: 1072px; height: 30px; flot: left; } И пользуясь случаем спрошу, как сделать чтобы выравнивание текста было не grekovtext а сразу например в h1 засунуть или, я недав…

    Asked by Дуня,

    0 votes
    17 answers

  12. Вёрстка блоков

    Привет! вот рабочий пример https://jsfiddle.net/soltx/hdytadeL/embedded/result/всё норм когда я задал ширину для label и у меня достаточно текста блок с вопросом прижат вот другой пример https://jsfiddle.net/soltx/qve5qwpb/embedded/result/ тут криво работает конструкция, нужно блок с вопросом, прижать к тексту, код должен быть универсальным, так как длина текста может быть разная и блок с вопросом всегда должен прижиматься к тексту, .item остаётся с фикс шириной в 300px

    Asked by soltx,

    0 votes
    2 answers

  13. Вёрстка блоков - как сделать логично?

    Здравствуйте. Верстаю макет, рассчитан для мобильных и планшетов, резиновый временами. Есть такой блок - http://joxi.ru/1A59OwzSKyoyPA . Это вариант для десктопов. Далее для планшетов - http://joxi.ru/V2Ve8MBS0J1DLm . И для мобильных - http://joxi.ru/DrlO1yQc4OMjRA Как будучи в здравом уме и хорошем психическом состоянии сверстать логично, без использования скрытых блоков, типа с заголовком или списком, которые расположены не правильно, как по мне, в планшетной и мобильной версии. Вообще, стоил ли попросить другой дизайн или намекнуть дизайнеру, что он немного не понимает, как верстается из десктопного варианта в мобильные?

    Asked by kattiperk,

    0 votes
    5 answers

  14. Верстка блоков за пределами окна.

    Здравствуйте. Вот сайт http://big-buy.in.ua/domashnij-kinoteatr.html. На странице сверстаны "уши" в виде ромбов. Сейчас - это абсолютно спозиционированные блоки :after и :before для #main-content. Проблема: 1) имеем горизонтальную полосу прокрутки(причем она появляется, только, если есть блок :before) 2) на iphone полоса прокрутки автоматически устанавливается по центру, контент как-бы прилипает к левому краю и левые уши не видно вообще. Пробовал устанавливать для body overflow-x: hidden, но это не выход, да и на айфонах проблема остается. Спасибо.

    Asked by vovka-morkovka,

    0 votes
    5 answers

  15. Верстка бокового меню на джумла через ul li

    Бьюсь с css, не выходит сделать пункты меню с фоновым изображением одинаковой фиксированной ширины - или все ломается или делает по ширине текста. Может кто сталкивался? Настраиваю через ul и li Сейчас такая каша уже: .hlink li { line-height:42px; width:180px; text-align:right; font-size:16px;} .hlink ul li a {width:180px; -webkit-border-radius: 5px; -moz-border-radius: 5px; border-radius: 5px; background-image:url(../images/80.png); border:1px solid #999; padding:8px 25px; text-align:right; font-size:16px; text-shadow:#555; color:#000; text-decoration:none} .hlink li a:hover { background-image:url(../images/bluebtn.jpg); background-repeat:repeat-x; color:#FFF} hashimk…

    Asked by knowledge,

    0 votes
    3 answers

  16. Вёрстка большого количества страниц

    Приветствую жителей форума! У меня к вам есть вопрос. Дело в том, что я изучаю вёрстку недавно и столкнулся с очень неприятной проблемой. Мне нужно было сверстать большое количество страниц одного сайта. На каждой странице было разное размещение информации. И для каждой страницы одинаковое положение и наполнение было только у шапки сайта и у подвала. Предположим, на главной была шапка, потом шёл блок со слайдером и подвал. На другой была шапка, две колонки (текст и форма обратной связи) и подвал. На третей опять шапка, после неё две колонки с новостями, которых в каждой колонке должно было быть по три штуки и для других страниц новостей должны были прикрутить скрипт, чт…

    Asked by SNIGOWYK,

    0 votes
    9 answers

  17. Верстка брэндинг с ссылкой

    Всем привет, Посоветуйте, как сверстать страницу с брэндингом , и так что бы фоновая картинка была ссылкой вот макет http://prntscr.com/3vy5fw Вот как это у клиента выглядит http://ezh1.i-d-web.com/

    Asked by Anna Zharova,

    0 votes
    9 answers

  18. верстка бэкграунда на высоту потребности макета

    Подскажите пожалуйста, как сделать так чтобы для определенного элемента, который охватывает все элементы макета, сделать так, чтобы определенная картинка, которая должна репититься через весь элемент, репитилась и за вертикальной прокруткой.

    Asked by VictorioIP,

    0 votes
    1 answer

  19. Верстка в 2 слоя и их позиционирование

    Добрые друзья! Обращаюсь к вам с вопросом, который не могу разрешить уже несколько дней... Есть страница, сверстанная слоями: Заголовок и подвал растягиваются в длину. Content - в длину и в высоту. Слой mini является чем-то вроде боковой колонки. Его высота иногда меняется, а ширина - нет. Вся проблема в том, что когда в слое content мало информации, слой mini наползает на подвал, перекрывая его! Я никак не сумел исправить эту проблему. Пытался использовать табличку, запихнув content и mini в две соседние ячейки, но это лишь породило новые проблемы - т.к. в content'e часто находится преформатированное содержимое (тег <pre>). Пробовал позиционирование - absolute о…

    Asked by dobriy-kot,

    0 votes
    1 answer

  20. Верстка в 3-2 колонки сразу

    Всем привет. Есть задача сделать 2-х колоночную верстку с динамическим добавлением 3 колонки по надобности. То есть. Если в третьей колонки есть информации, то выводить ее и чтобы вторая колонка уступала третьей колонки место. А если нет третьей колонки, то вторая колонка занимала все свободно место. Вот не пойму, как это возможно сделать. Буду благодарен за помощь. P.S. без JS

    Asked by ihappy,

    0 votes
    1 answer

  21. Верстка в Firefox

    Есть необходимость использовать окна фиксированного размера для текста. Нужно, чтобы если HTML содержимое не помещается в окно, показывалась прокрутка. Использую следующее решение: fieldset.radios { overflow: auto; height: 300px; } <fieldset class="radios"> <label><input type="radio" ...>Thing 1</label> <label><input type="radio" ...>Thing 2</label> ... </fieldset> Работает идеально во всех браузерах, кроме Firefox, где прокрутки нет и текст просто "вываливается" из окна: пример Подскажите, как можно исправить это для Firefox?

    Asked by Allality,

    0 votes
    8 answers

  22. вёрстка в html5

    Всем привет! Друзья нужен совет, ибо изучение html5 на практике зашло в тупик делаю главную страницу сайта так: <header>шапка</header> <nav>навигация</nav> <div>???</div> <footer></footer> вопрос вот в чём: в этом месте <div>???</div> я хочу расположить основной контент станицы - слайдер - блок: новинки (картинка - название) - блок: хиты продаж (картинка - название) В каких тегах правильно это разместить - слайдер и блоки?

    Asked by vadim525,

    0 votes
    6 answers

  23. верстка в виде iphone

    Как можно сверстать страницу в виде iphone, ну то есть в середине страницы iphone естесственных размеров и там внутри скролл и текст

    Asked by vvsh,

    0 votes
    8 answers

  24. верстка в дивах

    Подскажите пожалуйста как сделать ссылку с одного дива ( меню ) на другой ( контент). <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!-- saved from url=(0044)http://bitby.net/wp-demo/size-fon/index.html --> <html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="ru-RU-lite"><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>фон</title> <!--<link rel="stylesheet" href="style.css" />--> <style type="text/css"> *{margin:0;padding:0;} html, body{ width:100%; height:100%; min-width:1000px; } …

    Asked by ianitta,

    0 votes
    5 answers

  25. Верстка в первый раз - в чем ошибка?

    Добрый день, уважаемые форумчане! Совсем недавно друг попросил сверстать ему Лендинг из PSD файла. Визуально лендинг не сложный, поэтому я согласился. С версткой до этого особо опыта не имел. В процессе вертски я сталкивался со всевозможными пролемами, которые удавалось решить с помощью гугла и форумов верстальщиков, за что вам огромное спасибо. Но одну проблему я так и не победил. Перехожу к сути: Дано: домен http://водоканал-сервис.рф Что хотел получить согласно макету PSD: http://joxi.ru/a2X3ZYMCq9qDmg Для верстки решил использовать Dreamveawer CC2015. Был выбран табличный тип верстки. Все вроде получилось кроме одного НО - в разных браузерах таблицы съезжают с фон…

    Asked by CHEBURNATOR,

    0 votes
    5 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