Модераторы: Illuminaty
  

Поиск:

Ответ в темуСоздание новой темы Создание опроса
> Помогите с версткой 
V
    Опции темы
wil
Дата 3.8.2006, 11:42 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 125
Регистрация: 28.3.2006

Репутация: нет
Всего: 4
Подскажите как правильней дивами отверстать такую вещь(прикреплено к сообщению) ?
Пояснения:  сначала снаружи темный бордер в 1px, потом светлая полоса в 1px(), потом уже изнутри контент. Вся трабла в том, что сверху справа в углу должна быть иконка, которая эти бордеры перекрывает. 
Знаю как криво сверстать таблицами. Как в дивах? smile

Это сообщение отредактировал(а) wil - 3.8.2006, 11:52

Присоединённый файл ( Кол-во скачиваний: 31 )
Присоединённый файл  sample.gif 4,54 Kb
--------------------
 
PM MAIL WWW   Вверх
Illuminaty
Дата 3.8.2006, 11:45 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56
Иконка должна перекрывать границы или нет? Не совсем понятно...
PM MAIL ICQ   Вверх
z-END
Дата 3.8.2006, 11:49 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


прафесар™
****


Профиль
Группа: Комодератор
Сообщений: 3014
Регистрация: 13.3.2003
Где: Венья, Пиетари

Репутация: 4
Всего: 102
div в div запихнуть.
у внешнего черный бордер, светлый фон и внктренний отступ в 1 пиксель, у вложенного просто серый фон наверно как-нить такsmile


--------------------
Каждый чилавек пасвоему праф...а памоему НЕТ! 
PM WWW ICQ   Вверх
wil
Дата 3.8.2006, 11:51 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 125
Регистрация: 28.3.2006

Репутация: нет
Всего: 4
трабла именно с иконкой - она должна перекрывать оба бордера. я ж написал в первом посте.
--------------------
 
PM MAIL WWW   Вверх
5naip
Дата 3.8.2006, 12:03 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 60
Регистрация: 6.7.2006

Репутация: нет
Всего: нет
в стилях картинки -
float:right;
margin:-2px -2px 0 0;

Добавлено @ 12:13 
Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
.out{
   width:500px;
   margin:0 auto;
   border:1px solid black;
   padding:1px;
   background-color:#999;}
.in{
   width:99.9%;
   border:1px solid white;
   background-color:#999;}
.img{
   float:right;
   margin:-3px -2px 0 0;}
</style>
</head>

<body>
<div class="out">
  <div class="in">
    <img class="img" src="1.gif" width="24px" height="24px" alt="0" />
  много текста
  </div>
</div>
</body>
</html>

рисунок я вырезал из твоего рисунка...размер его - 24х24...
может быть я <style></style>  не туда написал....ни разу так не делалsmile
PM MAIL   Вверх
Illuminaty
Дата 3.8.2006, 12:14 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56
Так подойдет?
Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Test Icon</title>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<style type="text/css">
body {
    background-color:#FFFFFF;
}
.divbody {
    background-color:#000000;
    padding: 1px;
}
.divbody_inside {
    background-color:#CBCBCB;
    color: #514F4F;
    padding: 5px;
    border: 1px solid white;
}
.icon {
    background-color:#FFFFFF;
    float:right;
    position:relative;
    top: -7px;
    right: -7px;
    width: 30px;
    height: 30px;
    padding: 1px;
}
.icon_inside {
    width: 28px;
    height: 28px;
    border: 1px solid black;
}
</style>
</head>
<body>
<div class="divbody"><div class="divbody_inside"><div class="icon"><div class="icon_inside">X</div></div>
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла 
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла 
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла 
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла 
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла 
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла 
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла 
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла
Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла Бла</div></div>
</body>
</html>
PM MAIL ICQ   Вверх
5naip
Дата 3.8.2006, 12:16 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 60
Регистрация: 6.7.2006

Репутация: нет
Всего: нет
эта бйда работает только в мозилле...smile
PM MAIL   Вверх
Illuminaty
Дата 3.8.2006, 12:23 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56
Чья байда, 5naip? Моя везде, вроде, работает smile 
PM MAIL ICQ   Вверх
5naip
Дата 3.8.2006, 12:24 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 60
Регистрация: 6.7.2006

Репутация: нет
Всего: нет
Код

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<style>
.out{
    width:500px;
    height:auto;
    background-color:#999;
    border:1px solid black;
    padding:1px;}
.in{
    width:99.9%;
    height:auto;
    border:1px solid white;
    background-color:#999;
    position:relative;}
.x{
    position:absolute;
    margin:-3px 0 0 479px;}
.xx{
    width:24px;
    height:24px;
    float:right;}
</style>
</head>

<body>
<div class="out">
  <div class="in">
    <img class="x" src="1.gif"><div class="xx"></div>
    sakldfhg;l skdasdfas dfas g;l skdasdfas dfas g;l skdasdfas dfas g;l skdasdfas dfas g;l skdasdfas dfas g;l skdasdfas dfas fsa fas df
  </div>
</div>
</body>
</html>

это работает везде....только ширна статична...

Добавлено @ 12:27 
я про свою говорил...smilesmile
чуть опоздал...

Это сообщение отредактировал(а) 5naip - 3.8.2006, 13:13
PM MAIL   Вверх
wil
Дата 3.8.2006, 13:04 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 125
Регистрация: 28.3.2006

Репутация: нет
Всего: 4
ребят, спасибо!  smile ща буду юзать какой-нить вариант.
--------------------
 
PM MAIL WWW   Вверх
Illuminaty
Дата 3.8.2006, 13:55 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56
Не за что. smile 
PM MAIL ICQ   Вверх
5naip
Дата 4.8.2006, 06:34 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 60
Регистрация: 6.7.2006

Репутация: нет
Всего: нет
wil, ну ты говори,как там у тебя дела?smile
PM MAIL   Вверх
wil
Дата 4.8.2006, 09:50 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 125
Регистрация: 28.3.2006

Репутация: нет
Всего: 4
пашет, куда оно денется smile вариант Illuminaty взял.
--------------------
 
PM MAIL WWW   Вверх
Illuminaty
Дата 5.8.2006, 12:08 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


/*Антон Захаров*/
***


Профиль
Группа: Комодератор
Сообщений: 1238
Регистрация: 19.3.2005
Где: Россия, Казань

Репутация: 25
Всего: 56
Всегда рад помочь smile 
PM MAIL ICQ   Вверх
5naip
Дата 8.8.2006, 11:06 (ссылка) | (нет голосов) Загрузка ... Загрузка ... Быстрая цитата Цитата


Шустрый
*


Профиль
Группа: Участник
Сообщений: 60
Регистрация: 6.7.2006

Репутация: нет
Всего: нет
хых...smile
PM MAIL   Вверх
  
 Ответ в темуСоздание новой темы Создание опроса
0 Пользователей читают эту тему (0 Гостей и 0 Скрытых Пользователей)
0 Пользователей:
« Предыдущая тема | Вёрстка веб-сайтов | Следующая тема »

Подписаться на тему | Подписка на этот форум | Скачать/Распечатать тему


 




[ Время генерации скрипта: 0.0511 ]   [ Использовано запросов: 21 ]   [ GZIP включён ]


Реклама на сайте     Информационное спонсорство

 
 По вопросам размещения рекламы пишите на vladimir(sobaka)vingrad.ru
Отказ от ответственности     Powered by Invision Power Board(R) 1.3 © 2003  IPS, Inc.