valign:bottom CSS?
8 отговора
0 прегледа
valign:bottom CSS?
<fieldset><legend>бла бла бла</legend>
<div>1</div> <div>2</div>
<div>3</div
</fieldset>
1 - този е в ляво и му знам височината
2 - този е отдясно, но височината му се мени според съдържанието. Може да е по-голяма или по-малка спрямо левия
3 - Тоя див го искам долу и в дясно винаги
Някаква идея как да стане с ЦСС?
<div>1</div> <div>2</div>
<div>3</div
</fieldset>
1 - този е в ляво и му знам височината
2 - този е отдясно, но височината му се мени според съдържанието. Може да е по-голяма или по-малка спрямо левия
3 - Тоя див го искам долу и в дясно винаги
Някаква идея как да стане с ЦСС?
Re: valign:bottom CSS?
Става, но понеже го слага под див1 и под него остава празно място, колкото е височината на див3. Просто не ме кефи.
Re: valign:bottom CSS?
е не можеш ли да му зададеш малко по голяма широчина от тази на 1. като например width:100%;
?
'In this life we cannot do great things. We can only do small things with great love'
'In this life we cannot do great things. We can only do small things with great love'
Re: valign:bottom CSS?
...добре, това ли е или аз бъркам?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[линк]">
<html xmlns="[линк]">
<head>
<title>Ex.</title>
<style>
*{
padding:0;
margin:0;
}
div{border:1px solid #000;}
fieldset{width:124px;}
#one{
width:50px;
float:left;
background:red
}
#two{
width:70px;
float:right;
background:blue
}
#three{
width:40px;
float:right;
clear:both;
background:green
}
</style>
</head>
<body>
<fieldset><legend>Ex.</legend>
<div id="one">1</div>
<div id="two">2<br /><br /><br /><br /><br /><br /><br /><br />end</div>
<div id="three">3</div>
</fieldset>
</body>
</html>
'In this life we cannot do great things. We can only do small things with great love'
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "[линк]">
<html xmlns="[линк]">
<head>
<title>Ex.</title>
<style>
*{
padding:0;
margin:0;
}
div{border:1px solid #000;}
fieldset{width:124px;}
#one{
width:50px;
float:left;
background:red
}
#two{
width:70px;
float:right;
background:blue
}
#three{
width:40px;
float:right;
clear:both;
background:green
}
</style>
</head>
<body>
<fieldset><legend>Ex.</legend>
<div id="one">1</div>
<div id="two">2<br /><br /><br /><br /><br /><br /><br /><br />end</div>
<div id="three">3</div>
</fieldset>
</body>
</html>
'In this life we cannot do great things. We can only do small things with great love'
Re: valign:bottom CSS?
Rазмени само името на двата стила one и two там дето са декларирани.
Див1 и див2 се разменят, но това няма значение за примера. Погледни как изглежда в браузъра и ще видиш разстоянието, което остава под див2. За това говорех в предният пост адресиран до теб
всъщност ето картинка:
Див1 и див2 се разменят, но това няма значение за примера. Погледни как изглежда в браузъра и ще видиш разстоянието, което остава под див2. За това говорех в предният пост адресиран до теб
всъщност ето картинка:
Re: valign:bottom CSS?
сега вече мисля че се разбрахме
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"[линк]">
<html xmlns="[линк]">
<head>
<title>Ex.</title>
<style>
*{
padding:0;
margin:0;
}
#outer{
width:120px;
border:1px solid #000;
}
#one{
width:50px;
float:left;
background:red
}
#two{
width:70px;
float:right;
background:blue;
}
#three{
width:40px;
height:22px;
background:green;
float:right;
margin-top:-22px;
position:relative;
}
#clearing{clear:both;}
</style>
</head>
<body>
<div id="outer">
<div id="two">1</div>
<div id="one">2<br /><br /><br /><br /><br /><br /><br /><br />end</div>
<div id="clearing">
<div id="three">3</div>
</div>
</div>
</body>
</html>
'In this life we cannot do great things. We can only do small things with great love'
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"[линк]">
<html xmlns="[линк]">
<head>
<title>Ex.</title>
<style>
*{
padding:0;
margin:0;
}
#outer{
width:120px;
border:1px solid #000;
}
#one{
width:50px;
float:left;
background:red
}
#two{
width:70px;
float:right;
background:blue;
}
#three{
width:40px;
height:22px;
background:green;
float:right;
margin-top:-22px;
position:relative;
}
#clearing{clear:both;}
</style>
</head>
<body>
<div id="outer">
<div id="two">1</div>
<div id="one">2<br /><br /><br /><br /><br /><br /><br /><br />end</div>
<div id="clearing">
<div id="three">3</div>
</div>
</div>
</body>
</html>
'In this life we cannot do great things. We can only do small things with great love'
Редактирано от sularome на
Re: valign:bottom CSS?
Да това искам :)
Благодаря, задължен съм ти
пп
малко се омазва със моите стилове за див 1, ама с един <бр/> се оправи.
Благодаря, задължен съм ти
пп
малко се омазва със моите стилове за див 1, ама с един <бр/> се оправи.