Adjustible Vertical line

This is a discussion on "Adjustible Vertical line" within the Starting Out section. This forum, and the thread "Adjustible Vertical line are both part of the Design Your Website category.


 Subscribe in a reader

Go Back   Webforumz.com > Main Forums > Design Your Website > Starting Out

Notices




Reply
 
LinkBack Thread Tools
  #1  
Old Mar 20th, 2007, 00:49
New Member
Join Date: Mar 2007
Location: Toronto
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Adjustible Vertical line

I want to put a custom made vertical line in my website that will separate the navigation section from the main text area. I want the line to automatically adust in its length if there more text on one page or the other or for the different resolutionsthat a viewer might have. Is this possible? If, so how do I go about creating it.

Thanks for all help.

Tazmania
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote

  #2  
Old Mar 20th, 2007, 10:16
Elite Veteran
Join Date: Sep 2006
Location: Pink House
Posts: 3,946
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Adjustible Vertical line

Create a background image that includes the vertical line. Then use the entire image as the background image of the div column. Have the image repeat-y.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #3  
Old Mar 20th, 2007, 15:09
New Member
Join Date: Mar 2007
Location: Toronto
Posts: 2
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Adjustible Vertical line

How do I control where the line is in background. When I make it a backfround picture the line is all the way through the site, even where I don't want it.

You mentioned something about the div column. What do you mean?Real newbie here.

Tazmania
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
  #4  
Old Mar 20th, 2007, 15:18
Elite Veteran
Join Date: Sep 2006
Location: Pink House
Posts: 3,946
Thanks: 0
Thanked 0 Times in 0 Posts
Re: Adjustible Vertical line

Good question..
A <div> is used when you design the xhtml/css way. There is a forum here called css if you want more information. There is a sticky with info on how to get started.

What I would suggest is to figure out where you want that vertical line to fall. It's going to be in a column. Let's say you want it on the right margin of your left column. Then figure out the width of your left column. Let's pick a ramdom width of 200 pixels wide. So in a graphics program, you make a new graphic that is 200 pixels wide. Select the background color of the site and add the vertical line on the right margin of the new graphic. I attached a graphic as an example.
Now that graphic becomes the background image of the column. It's obviously not long enough to go down the page so you "repeat the graphic on the y axis ( repeat-y )

Then it fills the column with the vertical line...

Let me know if I've confused you more!


Last edited by Lchad; Jun 17th, 2007 at 11:22.
Digg this Post!Add Post to del.icio.usBookmark Post in TechnoratiFurl this Post!Spurl this Post!Reddit! Wong this Post!
Reply With Quote
Reply

Tags
adjustible, vertical line

Thread Tools

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Vertical centering - please help! mpnuttall Web Page Design 6 Apr 16th, 2008 11:38
CSS Vertical Menu. Can someone help? CoolNeb Web Page Design 3 Jul 16th, 2007 18:00
Div Vertical Align jwalker80 Web Page Design 5 Jan 30th, 2007 23:34
Problem with vertical allignment Audioz Web Page Design 5 Dec 6th, 2004 14:01
Vertical Centering in CSS gwx03 Web Page Design 1 Dec 5th, 2003 15:36


All times are GMT. The time now is 00:38.


Powered by vBulletin®
Copyright ©2000 - 2008, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.2.0 RC8
© 2003-2008 Webforumz.com : All Rights Reserved

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42