Contact US

Log In

Come Join Us!

Are you a
Computer / IT professional?
Join Tek-Tips Forums!
  • Talk With Other Members
  • Be Notified Of Responses
    To Your Posts
  • Keyword Search
  • One-Click Access To Your
    Favorite Forums
  • Automated Signatures
    On Your Posts
  • Best Of All, It's Free!

*Tek-Tips's functionality depends on members receiving e-mail. By joining you are opting in to receive e-mail.

Posting Guidelines

Promoting, selling, recruiting, coursework and thesis posting is forbidden.

Students Click Here

Liquid vertical bar

Liquid vertical bar

Liquid vertical bar

Hi - I am adding some code to an existing file and would appreciate some help. I want to add two bars that go the full length of the left side of a page. The length will change from time to time. I tried adding "height: 100% and height: auto" but it does not work. It will work when I add height: 50em, but I need some thing fluid. I also tried to move the </div> around without too much luck.

Here is part of the code.

<div> <!-- Container -->
<div style="float: left; background-color: #893AA4; width: 10%; "><!-- bar 1 --></div>

<div style="float: left; background-color: gray; width: 0.5%; "> <!-- bar 2 --></div>

<div style="float: left; background: white; background-repeat: repeat-y; width: 89%; height:100%;font-family: Gill, Helvetica, sans-serif; font-size: 1.1 em;height: 100%; ">
<h1 style="font-size: 2em; text-align: center; color:red; ">test</h1>

Thank You... Ronnie

RE: Liquid vertical bar

If the parent element does not have an explicit height set in a stylesheet or style attribute, the child element cannot determine what it is supposed to be 100% of.


Indifference will be the downfall of mankind, but who cares?
Time flies like an arrow, however, fruit flies like a banana.

Never mind this jesus character, stars had to die for me to live.

RE: Liquid vertical bar

Thanks... It worked!

Red Flag This Post

Please let us know here why this post is inappropriate. Reasons such as off-topic, duplicates, flames, illegal, vulgar, or students posting their homework.

Red Flag Submitted

Thank you for helping keep Tek-Tips Forums free from inappropriate posts.
The Tek-Tips staff will check this out and take appropriate action.

Reply To This Thread

Posting in the Tek-Tips forums is a member-only feature.

Click Here to join Tek-Tips and talk with other members! Already a Member? Login

Close Box

Join Tek-Tips® Today!

Join your peers on the Internet's largest technical computer professional community.
It's easy to join and it's free.

Here's Why Members Love Tek-Tips Forums:

Register now while it's still free!

Already a member? Close this window and log in.

Join Us             Close