Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Flexible width line between two elements with CSS? Re: Flexible width line between two elements with CSS?

#110991
nichodiaz
Member

Ok… I hope I can help… I basically made a index.php page that places the divs for two boxes with some text in them

Then… I set up some divs for container purposes and of course set a css page up externally so I could move around the content.

The point of this was so you could take the code and play with the numbers to see how you can move border lines up and down. Once you have it done you can change the colors and make it look pretty. this can also be down with the em tag or %. I like to make the content in boxes and then set the site its self to a em.

********************************* HTML****************************************************

how to make a header

echo ‘‘;
?>


******************************************************** CSS********************************************
#header{
width: 100em;
height: 100px;
}

#wrap{
width: 1200px;
height: 100px;
margin: 0 auto;
padding-top: 15px;
}

#boxleft{
width: 300px;
height: 100px;
float:left;
border: solid #000;
line-height: 20px;

}

#line{
width: 590px;
background:#313030;
border-bottom:5px solid #313030;
margin: 0 auto;
position: absolute;
top: 53px;
left: 500px;

}

#boxright{
width: 300px;
height: 100px;
float:right;
border: solid #000;
line-height: 20px;

}