Вопрос по вёрстке (fieldset и legend)

(Ответов: 15, Просмотров: 933)
Страница 2 из 2 Первая 12
  1. Веб-дизайнер Аватар для 13bis
    • Регистрация: 17.02.2014
    • Сообщений: 394
    • Репутация: 170
    В общем ничего простого я не придумал, кроме как такой вариант, может кому и пригодится на будущее:

    Код:
    <div style="background-color:#f8f8f8; position:relative; border:1px #9b9b9b solid; margin-bottom:40px;">
    <div style="width:83px; left:10px; 	position:absolute; background-color:#fff; height:2px; top:-2px;"></div>
    <h1 style="position:absolute; top:-30px; left:15px; padding-left:0px; padding-right:10px; font: 800 22px 'Trebuchet MS', Arial, Helvetica, sans-serif;">РАМКА</h1>
    <p>текст</p>
    </div>
    • 0
  2. [web-developer] Аватар для cOAPerator
    • Регистрация: 22.02.2011
    • Сообщений: 615
    • Репутация: 111
    • Webmoney BL: ?
    13bis, а чего 2 блока не подложите? чтобы было один в один как в legend ?
    • 0
  3. Веб-дизайнер Аватар для 13bis
    • Регистрация: 17.02.2014
    • Сообщений: 394
    • Репутация: 170
    cOAPerator, не понял суть.. В смысле ещё 2 блока что-ли? Эээ, не догоняю...
    • 0
  4. [web-developer] Аватар для cOAPerator
    • Регистрация: 22.02.2011
    • Сообщений: 615
    • Репутация: 111
    • Webmoney BL: ?
    13bis, вот накидал:
    Код HTML:
    <div style="background-color:#f8f8f8; position:relative; border:1px #9b9b9b solid; margin-bottom: 10px; border-radius: 4px;"> <div style="width:70px; left:10px; 	position:absolute; height:2px; top: -10px; height: 20px;"> <h1 style="position: absolute; top: -5px; padding: 0px; z-index: 1;">LEGEND</h1> <div style="width:70px; left: 0px; top: 0px; position:absolute; background-color:#fff; height:10px; border: 0px #9b9b9b solid;"></div> <div style="width:70px; left: 0px; top: 9px; position:absolute; background-color:#F8F8F8; height:10px; border: 0px #9b9b9b solid;"></div> </div> <div style="padding: 10px;"> <p>текст</p> <p>текст</p> <p>текст</p> </div> </div> <fieldset> <legend>LEGEND</legend> <p>текст</p> <p>текст</p> <p>текст</p> </fieldset>
    посмотрите в опере, хроме, разницы почти нет
    Нажмите на изображение для увеличения.  Название:	Image 001.jpg  Просмотров:	7  Размер:	7.7 Кб  ID:	14222
    Последний раз редактировалось cOAPerator; 08.04.2014 в 00:33.
    • 1

    Спасибо сказали:

    13bis(08.04.2014),
  5. Веб-дизайнер Аватар для 13bis
    • Регистрация: 17.02.2014
    • Сообщений: 394
    • Репутация: 170
    cOAPerator, на мой взгляд это уже лишние 2 блока..
    • 0
  6. [web-developer] Аватар для cOAPerator
    • Регистрация: 22.02.2011
    • Сообщений: 615
    • Репутация: 111
    • Webmoney BL: ?
    13bis, мой вариант позволяет сделать один в один как стандартный fieldset. но дело ваше.
    • 0
Страница 2 из 2 Первая 12

Похожие темы

Темы Раздел Ответов Последний пост
вопрос по верстке HTML когда один контейнер наезжает на другой
Web программирование 4 17.06.2013 03:14
Вопрос по верстке
Web программирование 12 25.07.2012 03:11
Вопрос по блочному обтеканию в верстке макета
Web программирование 3 29.03.2012 15:12
Вопрос по css верстке
Web программирование 11 03.01.2012 23:48
Вопрос по <div> верстке в css
Web программирование 12 05.12.2011 23:17

У кого попросить инвайт?

Вы можете попросить инвайт у любого модератора:

Информеры