Agata
K.
Ilustrator / Graphic
Designer
Temat: Jak zrobić rozciagający się z tłem separator pionowy?
Witam wszystkich. :)Mam problem, chciałabym zrobić rozciągający się wraz z tłem separator pionowy, a właściwie dwa. Na stronie są trzy kolumny rozdzielone wykropkowanymi liniami pionowymi. Chciałabym żeby linie rozciągały się tak jak tło pod tymi kolumnami (tło rozciąga się w dół tyle ile wynosi najdłuższa kolumna). Mam nadzieję, że mi podpowiecie, bo już nie wiem co robić... :(
HTML:
<div id="content">
<div class="wrapper">
<div class="main_content">
<div id="column1">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin sagittis sollicitudin elit, vitae accumsan turpis venenatis in. Praesent hendrerit vestibulum nisi non rhoncus. </div>
<div class="vertical_dotted_line"></div>
<div id="column2">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin sagittis sollicitudin elit, vitae accumsan turpis venenatis in. Praesent hendrerit vestibulum nisi non rhoncus. </div>
<div class="vertical_dotted_line"></div>
<div id="column3">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Proin sagittis sollicitudin elit, vitae accumsan turpis venenatis in. Praesent hendrerit vestibulum nisi non rhoncus. </div>
</div>
</div>
</div>
CSS:
.horizontal_dotted_line
{
float: left;
border-bottom: 1px dotted #999999;
width: 100%;
margin-top:20px;
margin-bottom: 20px;
}
.vertical_dotted_line
{
float: left;
border-left: 1px dotted #999999;
height: ????????????????????????????????????????????????????;
margin-left:10px;
margin-right: 10px;
}
.wrapper {
margin: 0px auto;
width: 960px;
height: 100%;
}
.main_content {
float:left;
width: 100%;
height: 100%;
background-color:#FFFFFF;
}
#column1 {
float: left;
width: 470px;
height: 100%;
margin-left: 8px;
}
#column2 {
float: left;
width: 245px;
height: 100%;
}
#column3 {
float: left;
width: 185px;
height: 100%;
}
Podsumowując, chodzi o to żeby vertical_dotted_line rozciągało się tak samo jak main_content.
Będę wam wdzięczna za podpowiedź. :)Agata K. edytował(a) ten post dnia 26.04.10 o godzinie 17:07