Jump to content
  • 0

Проблема с максимальным расширением дива в диве среди дивов


Aleks_P
 Share

Question

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>
<head>
<title></title>
<style type="text/css">
div {
border: 1px solid #000000;
padding: 5px;
}
</style>
</head>
<body>

<div style="width: 500px;">
<div style="float: right;">Right</div>
<div style="float: right; width: 80%;">Center</div>
<div style="">Left</div>
</div>

</body>
</html>

Возможно ли сделать так, чтобы Center автоматически расширялся до максимально возможного размера, но без нарушения структуры? Если поставить 100%, то все разъезжается.

Link to comment
Share on other sites

6 answers to this question

Recommended Posts

  • 0

css:

.left {float:left; width:100px;}
.right {float:right; width:100px;}
.center {margin:0 100px 0;}
.clear {clear:both;}

html:

<div class="left"></div>
<div class="right"></div>
<div class="center"></div>
<div class="clear"></div>

ps: тема уже обсуждалась. юзайте поиск а так же загляните в статьи

да бы глубже разобраться с данным вопросом.

так же на перед рекомендую почитать про 3х пиксельный баг в IE6

Link to comment
Share on other sites

  • 0

klierik - у этого способа есть недостаток - если левая колонка длинная, а в центральной приходится применять clear - то все что ниже дива с сlear - будет ниже левой колонки

<div class="left">left1
left2
left3
left4</div>
<div class="right">right1
right2</div>
<div class="center">
center1
<div class="clear"></div>
center2 - эта строка должна быть второй, а будет ниже 4-й
</div>

Link to comment
Share on other sites

  • 0

а вообще есть спецификация css. она правда написана достаточно сухо. но я думаю, стоит потратить 2 дня для того, чтобы ее внимательно прочитать. особенно раздел о позиционировании, таблицах, формах и наследовании)

многое после этого проясняется

вот тут есть на русском языке:

http://www.internet-technologies.ru/specifications.html

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • 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