[thelist] a vertical line with div/css question!!

bruce bedouglas at earthlink.net
Tue Sep 6 13:51:10 CDT 2005


(thanks for all the help with my prior footer question!!)

hi...

i'm curious as to how i could easily create a vertical line between the
'left area/right area' of the below diagram.

i have a site/page structure that i want to look like the following:
         +------------------------------------------+
         |                                          |
         |             Header                       |
         |                                          |
         |                                          |
         +------------------------------------------+
         |                        (Nav Menus)       |
         +------------------------------------------+
         |           |                              |
         |           |                              |
         |           |                              |
         |           |                              |
         |(Left Side)|      Right Side              |
         |           |      (Text Area)             |
         |           |                              |
         |           |                              |
         |  Menu/    |                              |
         |  Login    |                              |
         |           |<<<<--------------------------|------<< vertical
line!!
         |           |                              |
         |           |                              |
         |           |                              |
         |           |                              |
         |           |                              |
         +------------------------------------------+
         |            Footer                        |
         +------------------------------------------+

the issue that i'm having is that i can set up the css to draw a line for
either the left or the right, based on the left-border, right-border, but it
doesn't get me what i'm looking for, given that the two areas may not
necessarily be the same legnth/size.

so, i thought my solution would be to simply create a css/div that would
have 'height: 100%;' and do a 1 px solid line. ummm.. nope, didn't work.
instead it gave me a vertical liine that was longer than either left/right
area..

i've looked through various sites/information but didn't find anything that
gave me what i'm looking for. although i did run across some people who've
apparently had a similar problem!!

any pointers/solutions would be helpful.

thanks

-bruce
bedouglas at earthlink.net



More information about the thelist mailing list