Jump to content
  • 0

Левый блок ширина в пикселях, а правый резиновый


art.u
 Share

Question

Здравствуйте.

Такой вопрос. Есть резиновый блок в нём ещё два (один из них не резиновый). Нужно чтоб эти два блока стояли рядом и полностью заполняли основной блок.

Дело в том что первый блок имеет постоянную ширину например 100px, второй резиновый.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Документ без названия</title>
<style type="text/css">
#main{
border:3px solid #000;
position:relative;
width:80%;
height:150px;
margin:0 auto;
}
#green{
border:2px solid #0F0;
width:100px;
height:140px;
margin-top:3px;
float:left;
}
#red{
border:4px solid #F00;
width:; /*==========сколько?==========*/
height:138px;
margin-top:2px;
}
</style>
</head>

<body>
<div id="main">
<div id="green"></div>
<div id="red"></div>
</div>
</body>
</html>

результат этого кода http://artemusenko.com.ua/test/test.html

Пожалуйста помогите если этот вопрос можно решить средствами HTML и CSS

Link to comment
Share on other sites

4 answers to this question

Recommended Posts

  • 0

Здравствуйте.

Такой вопрос. Есть резиновый блок в нём ещё два (один из них не резиновый). Нужно чтоб эти два блока стояли рядом и полностью заполняли основной блок.

Дело в том что первый блок имеет постоянную ширину например 100px, второй резиновый.


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<title>Документ без названия</title>
<style type="text/css">
#main{
border:3px solid #000;
position:relative;
width:80%;
height:150px;
margin:0 auto;
}
#green{
border:2px solid #0F0;
width:100px;
height:140px;
margin-top:3px;
float:left;
}
#red{
border:4px solid #F00;
width:; /*==========сколько?==========*/
height:138px;
margin-top:2px;
}
</style>
</head>

<body>
<div id="main">
<div id="green"></div>
<div id="red"></div>
</div>
</body>
</html>

результат этого кода http://artemusenko.com.ua/test/test.html

Пожалуйста помогите если этот вопрос можно решить средствами HTML и CSS

#main{
border:3px solid #000;
position:relative;
width:80%;
height:150px;
margin:0 auto;
}
#green{
border:2px solid #0F0;
width:100px;
height:140px;
margin-top:3px;
float:left;
}
#red{
border:4px solid #F00;
width:; /*НИСКОЛЬКО*/
height:138px;
margin-top:2px;
margin-left:110px;
}

Edited by Softlink
Link to comment
Share on other sites

  • 0

Большое спасибо=))

p.s. наверно надо больше спать

на здоровье!

p.s. меня дедушка в свое время приучил. Когда что-то учишь, потом на ночь ложи книжку под подушку. :) Попробуйте совместить приятное с полезным. Самовнушение все же работает.

А можно вопрос на засыпку? Зачем relative поставили?

Link to comment
Share on other sites

  • 0

А можно вопрос на засыпку? Зачем relative поставили?

Чтоб #main не смог ни при каких обстоятельствах отказаться от своих родительских обязательств=)

Согласен relative там не нужно)

Edited by art.u
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