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. Проблема с float

    В первые столкнулся с тем что float убивает прозрачность вот в таком случае. <div style="background:#999999;"> <div style="float:left;">Лево</div> <div style="float:right;">право</div> </div> Заметьте в первом div стоит цвет фона. В след двух float и если убрать хоть с одного то появится фон первого, а вот в такой конструкции фон белый.

    Asked by FERZ,

    0 votes
    8 answers

  2. Проблема с float

    Пытаюсь прикрепить футер к низу через position:absolute и bottom:0px . Т. е. положение футера зависит от высоты body. Проблема в том, что блоки с float:left не влияют на эту высоту (для всех кроме IE). Методом "тыка" удалось выяснить, что если к самому body приписать float:left , то все начинает работать как надо. Но я не знаю нормально ли к body такое приписывать. По крайней мере, нигде этого не встречал. Четко сформирую вопросы: 1. Можно ли к body приписывать float:left ? Не появятся ли из-за этого потом проблемы? 2. Как обычно поступают в таких случаях (про существование гугла я знаю, но в тех случаях, что мне удалось найти либо футер крепился по-другому, либо не было …

    Asked by Riim,

    0 votes
    7 answers

  3. Проблема с float

    Столкнулся с проблемой - если к стилю подключать float:left/right; то этот div выходит изза мейн дива вниз,причем они не стоят около друг друга как по сути должны(раз флоат есть), а тот кто выше в коде ,тот и стоит выше. В IE8 такого косяка нет,есть косяк связанный с этим же с футером. А вот в firefox все перекашивает ппц. Пробывал создавать 2 мейн дива один за другим,не помогает. html <body><center> <div id="uppercontent" > <div id="head" > </div> <div id="sponsors"> </div> </div> <div id="mainpart"> <div id="leftmenu"> </div> <div id="maincontent"> </div> <div id="footer"> Footer </d…

    Asked by oomozar,

    0 votes
    16 answers

  4. Проблема с float

    есть трехколоночный макет, вот часть кода, с которым возникла проблема - блоки должны ити горизонтально, но почему-то сползли и расположены вертикально: <div id="main"> <div style="float: left;"> <div style="height: 48px; width: 209px; background-image: url('{THEME}/images/box_header.jpg');"></div> <div style="height: 200px; width: 183px; margin-left: 13px; background-image: url('{THEME}/images/box_background.jpg');"></div> </div> <div style="margin-left: 10px; float: left;"> <div style="height: 63px; width: 57px; background-image: url('{THEME}/images/content_top_left.jpg'); float: left;"></div> <…

    Asked by Watchman,

    0 votes
    14 answers

  5. Проблема с float

    Мне нужно, чтобы блоки располагались на странице один за другим без промежутков. А получается вот что - http://i042.radikal.ru/1101/f3/c05e0ed9c24b.jpg Вот стиль для этих блоков: .cat_box { position: relative; float: left; width: 150px; height: auto; margin: 0 8px 15px 0; padding: 0; border: 1px solid red; } Подскажите, плиз, как это исправить?

    Asked by Mila,

    0 votes
    2 answers

  6. Проблема с float

    привет всем) я чайник в верстке, учусь. Хотя, думал, с флоатом справлюсь... Суть проста. Есть два блока, по 50% ширины каждый. Ставлю каждому float: left; width: 50%; (бордер для наглядности проблемы) результат причем происходит все так. Есть класс .block, для которого стоят только отступы. Так как они одинаковые для всех. .block { margin-bottom: 30px;} Ну и классы .w50p {width: 50%;} .floatleft {float: left;} Прописываю <div class="block w50p float">бла бла</div> <div class="block w50p float">бла бла</div> ЕСЛИ прописать дополнительно .block {margin-bottom: 30px; float: left;} То блоки становятся ровно, зато лезут другие косяки, связанные с от…

    Asked by nickostyle,

    0 votes
    4 answers

  7. проблема с float

    промлема в том, что когда я прописываю картинке float, она становится как бы не видимой для блоков которые следуют после неё... помогите кто чем может)) вот код: <div id="content"> <h1>Home</h1> <img class="line" src="img/line.png" alt="дет сайт" /> <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Suspendisse sagittis. Donec dictum, magna ullamcorper eleifend dapibus, lectus purus condimentum tellus, eu blandit nisl augue et massa. Mauris nisl diam, placerat vel, lacinia eu, luctus at, orci.Cras eget libero at sapien molestie condimentum. Ut interdum elit in risus. Pellentesque nisi. Aenean mauris nisl, interdum eu,tempor f…

    Asked by BondJ,

    0 votes
    4 answers

  8. Проблема с float

    Друзья, проблема такая. Есть две колонки, состоящие из блоков со свойством float:left внутри контейнера, перед закрывающим тегом которого стоит блок со свойством clear:both, чтобы контейнер растянулся на высоту колонок. Так вот проблема в том, что одна из колонок этот контейнер всё равно не растягивает, и залазит на элементы, находящиеся ниже (в моём случае на футер). Пример проблемы здесь: _http://berezkairk.ru/доставка/ - правая колонка вылазит за пределы контейнера wrapper несмотря ни на какие clear:both (смотреть лучше с шириной окна браузера не менее 1024, т.к. ещё не под все разрешения css написан). Я уже не первый год в вёртске, но в данном случае я уже просто не з…

    Asked by StormMan,

    0 votes
    2 answers

  9. Проблема с float

    Здравствуйте! Код: <div class="frame"> <div class="float-block"> <div class="image"></div> <div class="holder">Красивое нарядное платье «Снежанна»</div> </div></div>.frame{ overflow:hidden; height:1%; margin:0 0 30px;}.float-block{ float:left; padding:20px; background-color:red; margin:;}.float-block .image{ float:left; background-color:blue; width:30px; height:30px; margin:0 10px 0 0;}.float-block .holder{ display:block; overflow:hidden; height:1%;}http://prntscr.com/23m7ge Почему «Снежанна» падает вниз , а не растягивает красный блок? Как флотнутый блок высчитывает свой размер?

    Asked by ruvi,

    0 votes
    4 answers

  10. проблема с float + div

    Привет всем ... У меня не то что проблема, мне нужна консультация ... Вот что я хотел спросить ... Я меня есть несколько блоков, основной <div id = "main">, и еще 3 дочерние <div id = "d1">, <div id = "d2">, <div id = "d3"> - хочу чтобы они строились по левому краю - есть - float: left; - все бы хорошо только прописывать флоат очень много надо ... Можно ли как-то задать осномвному блокe <div id = "main"> правило чтобы все дочерние блоки строились слева ... т.е. мне нужно показать как можно используя одно правило для <div id ="main"> - заставить все внутренние блоки строиться слева как в float: left; <html> <head> <ti…

    Asked by zerofx,

    0 votes
    7 answers

  11. Проблема с float в IE

    Добрый день уважаемые форумчане. При верстке страницы возникла следующая проблема в браузере IE: На странице имеется менюха, сверстанная следующий образом: HTML <ul id="steps_ul"> <li><a href="#">1</a></li> <li><a href="#">2</a></li> <li><a href="#">3</a></li> </ul> CSS #steps_ul li { float:left; } #steps_ul li a { display:block; width:114px; height:99px; background-image:url(../images/general/steps_normal.png); background-repeat:no-repeat; Под ней расположен div блок (смотреть картинку) фиксированного размера. Насколько мне известно, когда элементу присваивается float, он ста…

    Asked by nazarlee,

    0 votes
    0 answers

  12. Проблема с float в IE 6-7

    Позвольте вопрос по верстке. Проблема с float в IE 6-7. Есть макет сайта, имеющий структуру, как на схеме (упрощенно). Суть в том, что в в div основного контента вставлены два дива, один из которых, по замыслу должен быть пристыкован к левому краю, второй, соотоветственно к правому. Внутри каждого пристыкованного дива находится таблица для структурирования контента. Для левого пристыкованного прописано align:left; float:left, для правого, соответственно align:right ; float:right. Во всех браузерах отображается нормально, кроме IE 6-7. В IE 6-7 текст не обтекает внутренние диву и "спускается" ниже, а между внутреннними дивами отображается пустое поле. Как решить проблем…

    Asked by Palomnik,

    0 votes
    4 answers

  13. проблема с float в ie6

    В ie6 правый блок (right) съезжает вниз, в остальных смотрелках все нормально отображается. Пожалуйста подскажите. <style type="text/css"> body { background-color: #666666; background-image: url(ventuno.gif); background-repeat: repeat; margin: 0; } .trans { opacity:0.5; filter:progid:DXImageTransform.Microsoft.Alpha(opacity=50); filter:alpha(opacity=50); -moz-opacity:0.5; background-color:#000000; width:100%; height:100%; position:absolute; margin:-30px; z-index:-1; } .container{ width:800px; margin-left: auto ; margin-right: auto; /*//display: inline;*/ } .shapka { position:relative; color:#FFFFFF; width:790px; height:100px; padding:30px; …

    Asked by alexgeo,

    0 votes
    3 answers

  14. Проблема с Float в IE8 и с Margin: 0 auto; в общем.

    Добрый день уважаемые дамы и господа. В общем учусь и набираюсь опыта в этом нелегком деле, и потихоньку делаю сайт. В общем на сайте на странице регистрации все нормально работает, но только не в IE, там почему то все Дивы берут и превращаются в лестницу, посмотрите пожалуйсто http://redsealtd.ru/?page=register Подскажите плизз что нужно написать в условных комментариях в таблице стилей для IE, что бы все показывалось как и Хроме и Мозилле. В общем если вы не возражаете, с вашего позволения задам 2 вопрос. В общем меню сверху хотел задать margin: 10px auto; что бы слева и справа был одинаковый отступ, что бы в общем меню было по центру. Вроде как дизайнеры так делаю. и п…

    Asked by hk416,

    0 votes
    11 answers

  15. Проблема с FLOAT в Опере 9.5

    Стандартно выстроил блоки в ряд с помощью свойства FLOAT:LEFT, но в Опере отображается с отступом (см. скрин). Макет резиновый, ширина блоков задана в процентах. Почти во всех браузерах нормально отображается, ну, немножко край выпирает (обведено красным), но не существенно. А вот, именно в Опере очень существенно! Подскажите, пожалуйста, есть ли какой-нибудь хак или способ исправить это глюк в опере? Заранее благодарен. скрин

    Asked by max999,

    0 votes
    10 answers

  16. проблема с float только в ie 2 слоя + javascript

    Добрый день! вся конструкция здесь: _http://007.su Мучаю здесь табы. в опере и файерфоксе флоатится все нормально, а в эксплоере нормально флоатятся только последние 2 таба, а первые 2 таба (их содержимое) не флоатится почему то. Помогите пожалуйста или хотя бы намекните, в какую сторону копать и еще в эксплоере почему-то табы активируются только если навести на сам текст (он в спане), в других браузерах все правильно работает - если навести на сам таб

    Asked by mustang,

    0 votes
    7 answers

  17. Проблема с FLOAT, нужен совет!

    Ребята, помогите решить проблему. Недавно начал интересоваться версткой и вопросы возникают чуть-ли не каждый день. Столкнулся с проблемой, которую не могу решить посредством поиска в Google. Суть проблемы: 1) Создаю div без фиксированной высоты. 2) Помещаю в него другие div с некоторым содержимым и задаю им свойство float: left 3) Родительский div при этом, что логично, игнорирует свои "внутренности" из-за вышеописанного свойства и его высота становится равна 0 4) Объекты, находящиеся ниже в разметке документа при этом начинают накладываться поверх div'a из п.1,3 Вопрос: можно ли каким-либо образом заставить родительский div регулировать свою высоту по содержимому, котор…

    Asked by ZNGR,

    0 votes
    3 answers

  18. Проблема с float: left

    Добрый день, Подскажете, пожалуйста, как исправить такую ошибку: Слой с float: left в ие7 после окончания колонки, которую он обтекает, уменьшает padding. Наглядно: html <div style="float: left"> <img src="/i/image.jpg" style="margin: 0; padding: 0"> </div> <div class="ctlg"> <div><h3>title</h3> <ul> <li>Фильтр для очистки и минерализации мягкой воды</li> <li>Картридж</li> <li>Угольная <a href="#">вставка УВ</a></li> <li>Дозаторы <a href="#">кальция</a> и <a href="#">магния</a></li> <li>Возможность регенерация картр…

    Asked by Diver2,

    0 votes
    5 answers

  19. проблема с float: left в IE6

    В IE 6 появилась проблема с двумя DIV'ами "col1" и "col2". В Опере и FF все ровно, а в IE 6 ( в других непроверял ) col2 опускается как ступенька ниже на высоту col1 и при этом не заходя за него. Живой пример: http://mobile.viptop.ru/ Может кто с этим сталкивался и знает причину?

    Asked by Sander,

    0 votes
    4 answers

  20. Проблема с float'ом

    <div style="width:80%; min-height:500px; background:#CCCCCC; margin:0 auto; position:relative;"> <div style="width:100px; min-height:500px; background:red; float:left;"></div> <div style="width:70%; max-width:800px; min-height:300px; background:black; margin:0 auto; color:#FFFFFF;"></div> <div style="width:100px; min-height:500px; background:red; float:right;"></div><br clear="all" /> </div> Правый красный блок съезжает! Нужно что бы у красных было float:left; и float:right; соответственно, а черный центрировался между ними! Но что бы при растягивании каждого по высоте тянулся и серый блок в котором и находятся эти 3 б…

    Asked by Spidey,

    0 votes
    3 answers

  21. Проблема с float'ом

    Всем привет. Есть UL лист из элементов(без декоров и лист стайлов). В элементах ссылки. Ссылка имеет меняющийся бэкграунд при наведении. На данный момент элементы расположены вертикально, я хочу сделать горизонтально и использую float:left; И тут возникает проблема: В FireFox вообще перестает читать элементы как ссылки. Бэкгрунд подавно не менятся. В Opera и IE читает ссылку и меняется бэк лишь при наведении на текст ссылки, а не на любую область в элементе. Пробовал display:inline - тоже самое проиходит. При желании вымещу css и html скрипты и сделаю скрины Спасибо за содействие.

    Asked by Wasc,

    0 votes
    9 answers

  22. проблема с font-face в firefox

    Доброго времени суток! Пытаюсь добавить на страничку сторонний шрифт, во всех браузерах работает, а в firefox нет: @font-face { font-family: 'Open Sans Light'; src: url('font/OpenSansLight.ttf');}Вот что по этому поводу пишут на хабрe: http://habrahabr.ru/sandbox/50935/ Но для решения этой проблемы они предлагают изменить настройку браузера, у меня этот способ не заработал. Есть какие-нибудь способы обойти этот баг? И этот баг проявляется только на локальных страничках с локальными шрифтами или как (тут я тоже не совсем понял)?

    Asked by Kenshi24,

    0 votes
    2 answers

  23. Проблема с font-stretch

    Доброе время суток! Буду очень благодарна за помощь. В .psd макете шрифт Microsoft Sans Serif , который в фотошопе растянут, в стилях я прописала тот же шрифт, тот же размер, а растянуть я хотела с помощью font-stretch, но не все браузеры понимают это свойство, к тому же работает не для всех шрифтов, Заказчик говорит что шрифт отличается, естественно, но я не знаю как решить эту проблему. Заранее спасибо.

    Asked by Suzanna,

    0 votes
    10 answers

  24. Проблема с fontsquirrel

    Проблема такая - мне очень нужен на сайте шрифт terminator cyr 4 и если его подключить просто через font-face, кириллица работает, но отображается уродливо. Пробовал через fontsquirrel - латинница работает, красиво отрендерилась, а вот кириллица не работает вообще. В настройках выбираю EXPERT, ставлю галочку напротив Cyrillic, а эффекта ноль! Всё равно не работает. Причём, в списке символов кириллица отображается, а вот в демо файле на выходе кириллицы уже нет. А если выбрать не EXPERT, а OPTIMAL, то в демо файле кириллица даже отображается, а вот на самом сайте уже не работает! Помогите пожалуйста, очень нужно.

    Asked by Prowhman,

    0 votes
    2 answers

  25. Проблема с footer

    Всем привет. Была проблема: "подвал" на сайте http://www.my-abc.info/ в мозилле уезжал вверх, т.е. следовал сразу за основным текстом. Проблему решил правкой css: добавил clear:left в классе .outfooter. http://www.my-abc.info/styles.css На другом сайте такая же проблема - http://www.sdmsp.com/ При этом в IE6 всё отображается нормально, а вот в остальных браузерах - низ уезжает вверх... Пробовал решить добавлением clear:both, но не помогает. http://www.sdmsp.com/styles.css http://www.sdmsp.com/mail.html У кого какие мысли? Я просто даже не знаю, где нужно искать проблему... Буду благодарен за любые подсказки.

    Asked by Nauticus,

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