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
-
2 div, под ними сверху полоса градиента
Суть в том, что у меня имеется два блока c содержимым, с ними все нормально, они встали рядом, конечно же при помощи float. Но есть проблема. Нужно под ними сделать градиент. Там стоит полоска градиента 1px и repeat-x. Когда у блоков center и right стоит Float, чтобы они стояли рядом градиент, установленный на общим div под ними не видно, Ниже градиента будет снова фон. Хочется сделать это используя минимум дополнительных блоков. Чего-то никак.. html - весь контент <div id="content-holder"> <div id="content"> <div id="center-content"> <h2 class="h2s">Заголовок Center</h2> </div> <div id="right-content">Right cont</div> &l…
0 votes2 answers -
2 div'a в одной строке
Делаю 2 div'a в одной строке, но между ними в Oper'е и FireFox'е возникает расстояние, помогите его убрать: <style> .g1, .g2 { width:50px; display:inline-block; } .g1 { background-color:rgb(125,55,0); } .g2 { background-color:rgb(55,0,125); } </style> <div class="g1"> 1 </div> <div class="g2"> 2 </div> Пробовал убрать отступ с помощью margin, padding, border - не помогло, если никак не убрать остаётся вроде только float'ом 2 block'а делать.
0 votes2 answers -
2 div'а по горизонтали.
Сталкнулся с такой проблемой. В header'е стоят 2 дива, один привязан к левому краю, второй соответственно к правому. И вот при растяжении-сужении когда они соприкасаются, то либо один перекрывает другой, либо один оптекает другой и проваливается вниз, в зависимости от position. Можно ли как то сделать так чтоб они не наезжали друг на друга и при этом оставались зафиксированными?
0 votes8 answers -
2 div'а поверх div
не знаю как это сделать, есть 3 дива и картинка, необходимо положить в основной див картинку и оставшиеся 2 поверх картинки Синим цветом основной вив в котором всё распологается Жёлтый цвет - картинка Красным те самые 2 div'а выступающие в роли кнопок пробовал z-index'ом но всё равное не получилось =( помогите пожалуйста, если вопрос на форуме повтор, извините. но я правда искал
0 votes1 answer -
2 Diva с шириной по 50% и float: left и их отображение в ie6 и ie7
Народ еще нашел странную особенность http://shinoda.ru/bug_fix/block_test.htm Баг в том что в шестой и седьмой версии ИЕ при ширине в 50% и с флоатом лефт (вроде бы поровну и в сумме 100%) не помещаются на одной линии. И даже вроде знаю из чего, вот решил покопать по-подробнее, итак по порядку Я брал и скриншотил экран и замерял правильно ли браузер расчитывает ширину и вот что получилось (разрешение у меня 1280): IE6: Ширина окна браузера (без учета скролла и всего отсального) - 1253 px Ширина одного блока при разрешении 1253px была равна 627px, умножаем это на 2 и получаем 1254!!! и тут уже понятно почему блоки не стоят на одной линии, итог - ИЕ неправильно посчитал по…
0 votes26 answers -
2 float-a
http://rang56.ru/pages/diplom/ Текст по середине едет вниз. Т.к. блоку что идет по центру присвоено clear:left. Как можно выкрутиться? (чтобы текст по середине шел столбцом) Текст формируется скриптом, тоесть изменить вывод нельзя, можно только стили поправить... http://rang56.ru/pages/aboutus/ Текст идет ниже только в IE, в опере все нормально. Но тут claer нигде не прописан. почемуто где начинается таблица текст спускается вниз(к концу левого блока)
0 votes0 answers -
2 footer'а и масштабирование ширины в Bootstrap 3
Делаю первый раз верстку под bootstrap — решил осваивать фреймворк и все такое. Проблема — «плывет» при сужении экрана. Он высокий, 400px, фоном стоит картинка. При сужении экрана столбцы, которые не помещаются по ширине, уходят вниз, но картинка не «размножается» по вертикали (вариант repeat-y не срабатывает так, как надо). Далее, под футером стоит еще одна строка (div height:80px) более темная по фону (в ней копирайты). При сужении экрана она не уходит вниз под все выстроившиеся вертикально колонки footer, а остается «прилеплена» к нему снизу, таким образом частично закрывая столбцы футера. Вот нормальный футер, который задуман: А вот после сжатия экрана: В вариан…
0 votes0 answers -
2 inline-block - один слева, другой справа.
Представим блок, внутри которого находятся 2 блока со стилем Inline-block (это им подходит по смыслу). Как мне разместить один блок у левого края, другой у края справа? Если я ставлю правому блоку до кучи стиль float: right, то мое оформление как Inline-block (то есть я не задаю ширину, а только паддинги и блок сам растягивается по соедржимому) почему-то сохраняется, кстати да - ведь так и должно быть? плавающие блоки не растянуты на всю ширину, а автоматом подстраиваются под содержимое... Не хотелось бы выводить элемент из потока, хм... Но видимо другого способа нет? УПД. Проблема еще в том, что эти блоки выравнены вертикально по центру.
0 votes11 answers -
2 viweport для страницы (или аналогичный эффект)
Дизайнер клиента придумал такой креатив. Есть 2 макета страницы - мобильный вид (320 px) и десктопный (1440 px). По его задумке, на устройствах до портретной ориентации планшетов должен показываться мобильный вид. Т.е. открываем на ipad в портретной ориентации - видим на весь экран мобильный вид. Открываем на десктопе или ipad в ландшафтном положении - видим десктопный. При этом нет адаптива - оно всё должно просто zoom-иться (как будто я неадаптивный сайт смотрю с указанным для него viewport) - т.е. на упомянутом ipad страница уменьшается чтобы вписаться в устройство. Такое вообще реализуемо? Два viewportа прописать, понятно, нельзя. Менять его от @media - тоже. Можно,…
0 votes3 answers -
2 Блока div Изменяют друг друга при наведении
Здравствуйте. Недавно начал изучать HTML и CSS. Хочу сделать рядом 2 блока div которые при наведении на любой из них увеличивались в ширине и изменяли ширину соседнего. А получается что при наведении на блок А он увеличивается и уменьшает ширину блока Б. А при наведении на блок Б он просто увеличивается и перекрывает блок А https://jsfiddle.net/ob4jyz0p/1/ Для наглядности: Курсор не в области этих блоков: |________А_50%________| |________Б_50%________| Курсор наведен на блок А: |____________А_80%____________| |____Б_20%____| Курсор наведен на блок Б: (Перекрывает Блок А) |____А_50%____|____________Б_80%____________|
0 votes4 answers -
2 блока div на одном уровне, отступ (padding) от границы у второго блока
http://cssdeck.com/labs/xzjihv5y <!doctype html> <html> <head> <meta charset="utf-8" /> <title>PAGE</title> </head> <body> <div class="wrapper"> <div class="menu_sidebar">menu</div> <div class="content_sidebar">content</div> <div style="clear: both;"></div> </div> </body> </html> .menu_sidebar { float: left; width: 250px; } .menu_sidebar, .content_sidebar { padding: 30px; } .wrapper { height: 100%; width: 600px; margin: 0px auto; } body { height: 100vh; margin: 0px; padding: 0px; } div { border: 1px solid gray…
0 votes2 answers -
2 блока рядом, один фиксированный, другой в % или проблема с "calc"
Значится, такая задача: Есть блок wrapper (черная рамка) - с margin 0 и max-width. Синий блок - задан жестко в пикселях. (допустим 100px) Красный задан : width: calc(100% - 100px);У синего - float right У красного - float left В итоге получается то, что нужно: при сжимании окна по горизонтали, синий блок остается как есть, а уменьшается только красный. Все супер. ===== Далее, когда эту прелесть открываем в Сафари, получается, между блоками образуется белый промежуток. Как оказалось, сафари игнорит width со свойством calc и попросту делает красный блок, шириной с контент, который в нем есть. ===== Вопрос: как можно такое же точно поведение реализовать, без св…
0 votes5 answers -
2 блока. ширина по содержимому и доступному месту
Проблема такая: серый блок может быть любой ширины, зеленый должен занимать всё оставшееся место (нижняя коричневая линия обязательна) Никакие варианты с width и float у зеленого не проходят - он получается либо по содержимому, либо на 100% ширины (включая и серый блок) В какую сторону копать? p.s.Рамки у блоков не нужны, нарисовал чтобы объяснить что нужно.
0 votes5 answers -
2 бордера вокруг блока
есть класс wrapper, растягивается на всю высоту экрана, но надо ему сделать рамку, точнее 2. одна 1px solid #000 другая 1px solid #999 как будет лучше всего добавить 2 бордера к wrapper'у? сталкивался кто-то? как лучше сделать чтобы получился эффект аля тень...? можно наблюдать в контакте... но, если добавляю рамку хотя бы в 1 пиксель то появляется скролбар у страницы...как бороться?
0 votes7 answers -
2 бордера или как иначе?
Доброго времени суток. Возникла такая проблема: <div class="block"> <h2>Заголовок</h2> <p>текст абзаца 1</p> <p>текст абзаца 2</p> </div> <style> .block{ width:200px; } .block h2{ border-bottom: 1px black; } </style> мне нужно что бы тег "p" разделялся между собой белой полоской, кроме того все теги "p" должны находиться в одной единой рамке. <style> .block p{ border: 1px white; } </style> не катит, поскольку между тегами рамка получается 2px. весь <div class="block"></div> в рамку тоже не могу взять, по сколько заголовок <h2>Заголовок</h2> попадает в эту рамку. Пробл…
0 votes4 answers -
2 бэкграунда в одном div. Возможно ли?
Приветствую всех. Подскажите пожалуйста- возможно ли использование двух бэкграундов в одном div? Один бэкграунд выровнен по верхнему краю, другой - по нижнему. Использование вложенных div_ов- решает проблему, но хотелось бы покрасивее.
0 votes1 answer -
2 вопроса
Здравствуйте. Просветите меня пожалуйста ) Вопрос 1: Как сделать так, чтоб при нажатии на текст-ссылку-выезжали снизу пункты относящиеся к этой ссылке. А то слишком муторно делать n-ое кол-во одинаковых страниц. А точнее последующее их редактирование. Если не сложно, объясните ) Вопрос 2: У меня имеется некоторое количество exel-файлов (таблиц). Можно ли как нибудь сделать так, чтоб они отображались на сайте. Главное чтоб при редактировании этих екселев- на сайте они тоже автоматически редактировались. Реально это вообще?:/
0 votes4 answers -
2 вопроса
Здравствуйте! есть два вопроса: 1. задача на первый взгляд просто до безобразия: написать код таблицы. 3 столбца 2 строки. 1-я колонка должна быть 1/3 от ширины всей таблицы. написала у первой колонки 33% (и 33.33% пробовала), но проверила js, ни то, ни другое желаемому не соответсвует!!! как быть? 2. как растянуть (сузить) div по ширине контента? т.е. див по ширине занимает столько места, сколько контента внутри буду благодарна за ответы или наводки на них!!!
0 votes24 answers -
2 вопроса
Подскажите, пожалуйста: 1. Как разместить два дива, имеющих каждый свою ширину, высоту, свои отступы(margin) на одной строке? А последующие элементы, чтобы располагались на другой строке? Можно конечно установить в дивах свойство display:table-cell и тогда они будут на одной строке, но тогда у них будет одинаковая высота и свойство margin не работает. 2. Нужно внутри дива разместить тег img. У дива должны быть поля(padding), а также, если картинка превышает заданные для неё max-height и max-width, то див должен спрятать выступающие части картинки. Кроме того нужно, чтобы выступающие части картинки прятались равномерно с каждой стороны, то есть, если картинка превышает ма…
0 votes2 answers -
2 вопроса в 1-ном! (Twitter Bootstrap; background-position;)
Здравствуйте. Так получилось что в данный момент у меня возникло сразу 2 вопроса, не имеющих между собой прямой связи. 2 поста создавать из за этого не хотелось. В общем - перейду к делу: 1) Можно ли отрепитить картинку 1px по обеим осям(x,y), создавая при этом необходимые отступы с требуемых сторон? (Учитывая что картинка имеет не однородный характер.. Знаю, что в другом случае конечно можно и средствами CSS3 обойтись..) 2) Возможно ли как то делать эти отступы больше чем с 2-х сторон? (Например, если нужно отступить с верху, c боку + что бы картинка до самого низа не репитилась? Есть ли простые обходные пути для таких задач?) 3) Насколько полезным(и актуальным), на данн…
0 votes2 answers -
2 вопроса по CSS
Вопрос: 1 У меня тут таков вопрос как сделать по типу списка в блоке типо: ? Меню ? - моя стрелочка (картинка) Меню - текст ! если не понятно вот скрин: http://s017.radikal.ru/i443/1203/3e/700365f6bfa9.png Вопрос: 2 короче у меня такая проблема как бэ как сделать так что-бы сайдбар и контент прижимался к футеру а то у меня такая фигня получаеться 1. http://s018.radikal.ru/i500/1203/7a/8f0a3ed8651c.png 2. http://s001.radikal.ru/i193/1203/92/4c697aab143d.png ПРоблема в том щито у меня ещё бордер прописан на контент так вот он не до конца доходит
0 votes6 answers -
2 вопроса повтор
Здравствуйте! я конечно очень рада, что было уделено такое внимание моим вопросам, но ответы на них так и не были получены!!! со вторым вопросом по поводу рястяжения (съужения) блока по ширине контента флоат помог, спасибо большое, но вот с таблицей все равно 1/3 не получается я вставляю для ячейки onclick="alert($(this).width()); alert($('table').width());" и то, что он выдает 1/3 не является, может что-то не то в скрипте написано? Спасибо большущее заранее!!!
0 votes11 answers -
2 вопроса, JavaScript+CSV и div в div
Всем привет у меня два вопроса: 1. Можно ли файл CSV отобразить на странице выбрав его на локальном компьютере и никуда не сохранив на сервере. 2. Возможно ли сделать что бы по нажатию кнопки добавлялся div не отображался а именно добавлялся новый, а при 10 нажатиях добавлялось 10 дивов друг под другом. Если это возможно сделать или кто-то делал подскажите пожалуйста как, или направьте в какую сторону копать.
0 votes2 answers -
2 дива по горизонтали
В общем, имеется небольшой глюк в ие: необходимо разместить 2 дива по горизонтали рядом, чтобы они занимали по 50% пространства, но чтобы между дивами был небольшой отступ размером в 2 пикселя. Делаю так: <style type=text/css> .block_top{ padding-left: 10px; height: 27px; line-height: 30px; overflow: hidden; margin-bottom: 4px; font-family: Arial; font-weight: bold; font-size: 11px; color: #FFF; background: url('images/block_top_fon.gif') repeat-x; } .block_content{ padding-left: 10px; padding-top: 5px; padding-bottom: 5px; background: #f6f6f6; overflow: hidden; position: relative; border: 1px solid #dddddd; font-family: Arial; font-weight: normal; font-size: 11px;…
0 votes1 answer -
2 дива прижать к третьему который ниже
есть два дива, один имеет фиксированую высоту, а другой плавающюю, в зависимости от контента, как мне сделать так что бы второй который имеет фиксированую ширину имел нижнюю границу свою на одной линии с дивом который меняет свою высоту вот пример. <!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>Слои по горизонтали</title> <style type="text/css"> body{ min-width: 400px; } #layer1 { background-color: #fc0; /* Цвет фона слоя */ border: 1px solid #000; /* Параметры рамки вокруг */ padding: 5px…
0 votes4 answers