Позиционирование div'ов - SEO форум MaulTalk.com

Сообщение сайта

(Сообщение закроется через 3 секунды)

Здравствуйте, гость (

| Вход | Регистрация )

SEO форум MaulTalk.com > Веб-строительство > Программная часть

Позиционирование div'ов

Опции

J@ME

Topic Starter сообщение

25.6.2010, 16:40; Ответить: J@ME

Сообщение #1

Группа: User
Сообщений: 2
Регистрация: 25.6.2010
Поблагодарили: 0 раз
Репутация:

Здравствуйте. Не подскажите, как разрешить такую проблему. Имеется 3 div'a.

/*CSS*/
.center{
    margin: auto;
    width: 450px;
    float:left;
    text-align: left;
    padding: 10px;
}

.right{
    margin: 10px 0 0 0;
    float:right;
    width: 200px;
}

.left{
    float:left;
    width: 200px;
    margin: 10px;
}
/*CSS*/

/*HTML*/
<div class="left"></div>
<div class="right"></div>
<div class="center"></div>
/*HTML*/

Необходимо, чтобы center располагался между left и right. В таком варианте всё работает, но необходимо, чтобы center растягивался на оставшееся пространство, если какой-либо(или оба) div(а) отстутствует. Например:

/*HTML*/
<div class="right"></div>
<div class="center"></div>
/*HTML*/

Если не указывать фиксированную длину div'a center, то он располагается под div'ами left и right(если они присутствуют), если контент в div center занимает больше пространства, чем ширина между div'aми left и right.

Ответить с цитированием данного сообщения

СиДжей СиДжей 25.6.2010, 21:07; Сообщений: 3 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	25.6.2010, 21:07; Ответить: СиДжей Сообщение #2
0 Группа: User Сообщений: 3 Регистрация: 18.8.2009 Поблагодарили: 0 раз Репутация: 0	Делаеться достаточно просто. Создай див в этот див вставь два блока и выровняй их по правому и левому краю. Тоесть центральным блоком будет этот самый основной блок.

J@ME Topic Starter J@METopic Starter 26.6.2010, 1:59; Сообщений: 2 Поблагодарили: 0 раз Репутация: 0 Просмотр профиля	Topic Starter 26.6.2010, 1:59; Ответить: J@ME Сообщение #3
0 Группа: User Сообщений: 2 Регистрация: 25.6.2010 Поблагодарили: 0 раз Репутация: 0	Тогда при наличии в этот "основном" блоке элементов, растянутых на весь div, они останутся под дивами в углах. Текст-то, конечно, будет обтекать, но, например, border-bottom будет и дальше под div'ами продолжаться.

Marf7

2.2.2011, 20:34; Ответить: Marf7

Сообщение #4

Группа: User
Сообщений: 68
Регистрация: 22.9.2007
Поблагодарили: 0 раз
Репутация:

Решние предложе но в другой теме пользователем HightinGlory

<!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"/>
<title>Test</title>
<script type="text/javascript" src="jquery.js"></script>
<style type="text/css">
*{
padding:0;
margin:0;
}
html,body,.top{
height:100%;
width:100%;
}
.middle{
float:left;
overflow:hidden;
width:100%;
height:40px;
}
.conteiner{
padding:0 20px;
height:40px;
}
.left{
background:#B5E3FF;
float:left;
margin-left:-100%;
position:relative;
width:20px;
height:40px;
}
.right{
background:#FFACAA;
float:left;
margin-left:-20px;
margin-right:-3px;
position:relative;
width:20px;
height:40px;
}
.block{
background:#000;
width:100%;
height:100%;
}
</style>
</head>

<body>
<div class="top">
<div class="middle">
<div class="conteiner">
<div class="block"></div>
</div>
</div>
<div class="left"></div>
<div class="right"></div>
</div>
</body>
</html>

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой

или обратитесь к любому из модераторов.

« Предыдущая тема · Программная часть · Следующая тема »

1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)

Пользователей: 0

Похожие темы

Тема	Ответов	Автор	Просмотров	Последний ответ
Моя div-ная верстка соответствует ли стандартам Хотелось бы конструктивной критики	10	muratastana	1596	14.1.2023, 1:16 автор: xweb
DIV'ы в строку	0	RedEclipse	5465	29.9.2016, 17:53 автор: -RedEclipse-
при выборе radio в option не скрывались div	0	serj123	6930	17.4.2016, 17:45 автор: -serj123-
Как заставить отображать несколько элементов DIV в одну строку?	2	Aalena	4016	10.1.2016, 10:18 автор: -Aalena-
Фоны в в div'ах расходятся при сужении экрана	1	Balalaaika1	5634	2.6.2015, 19:35 автор: -Degradator-

Режим отображения: Стандартный · Переключить на: Линейный · Переключить на: Древовидный

Подписка на тему · Сообщить другу · Версия для печати · Подписка на этот форум

Текстовая версия

Сейчас: 20.4.2024, 12:45

Дизайн