AJAX Forums

How do you control the height of DIV section using CSS?

This is a discussion on How do you control the height of DIV section using CSS? within the XHTML and CSS forums, part of the Beginners AJAX category; I'm trying to use DIV sections and CSS to add a border along the left side of a web page using two image files. Both images have a width ...


Go Back   AJAX Forums > Beginners AJAX > XHTML and CSS

Register FAQ Members List Calendar Search Today's Posts Mark Forums Read
Old 06-08-2007, 04:53 AM   #1 (permalink)
Junior Member
 
Join Date: Jun 2007
Posts: 1
Rep Power: 0 SwissCheeseo is on a distinguished road
How do you control the height of DIV section using CSS?

I'm trying to use DIV sections and CSS to add a border along the left side of a web page using two image files. Both images have a width of 100 pixels. The first image has a height of 568 pixels and should appear at the top left of the screen. It should not repeat. The second image should appear directly below the first, has a much smaller height and should repeat until it reaches the bottom of the page. Together they make a gradient border. I'm using two DIV sections to divide the top and bottom sections. I've given the first one a height of 568 pixels and I've given the second one a height of 100%. My problem is that the second section extends beyond the end of the main page. It's as if setting the height for the second section makes the DIV the height of the screen but then places it 568 pixels away from the top, making it hang to far down on the bottom of the page. I hope I have explained this well enough for someone to be able to understand.
__________________
SwissCheeseo is offline   Reply With Quote
Old 06-08-2007, 08:01 AM   #2 (permalink)
Junior Member
 
Join Date: Jun 2007
Posts: 1
Rep Power: 0 jasonjas is on a distinguished road
nevermind...just make both of them 100% size in height and see what happens. I've noticed a while ago that using two different sets of numbers (percentage/pixels) will mess it up, sometimes.
__________________
jasonjas is offline   Reply With Quote
Old 06-08-2007, 10:41 AM   #3 (permalink)
Junior Member
 
Join Date: Jun 2007
Posts: 1
Rep Power: 0 whozurdaddy187 is on a distinguished road
My suggestion would be to have innerlying Divs, the inner Div (use it for your top) will overwrite the outer Divs properties... I had to to do for a footer.
__________________
whozurdaddy187 is offline   Reply With Quote
Old 06-08-2007, 03:51 PM   #4 (permalink)
Junior Member
 
Join Date: Jun 2007
Posts: 1
Rep Power: 0 bob_eponge64 is on a distinguished road
You don't need a tag for each one of your images, just one class for each. Just insert both your images into one div, even side by side, and paste following code in your style tag: .border-top {float: left;margin: 0px 15px 0px 0px;}.border-bottom {float: left;margin: 0px 15px 15px 0px;}Then you apply the right .class one for each image. I'm sure you will like the result, this will place them left side, together and will give place for text or whatever you like on right side as well as below the second one.
__________________
bob_eponge64 is offline   Reply With Quote
Reply

Bookmarks


Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)

 
Thread Tools
Display Modes


Similar Threads

Thread Thread Starter Forum Replies Last Post
AJAX Jobs : PHP Questionaire with admin section by mavromytis admin AJAX Freelance Jobs 0 09-20-2008 07:02 AM
AJAX Jobs : Website section I don't want to refresh by Timoitserv admin AJAX Freelance Jobs 0 09-18-2008 05:07 PM
AJAX Jobs : Magento Admin simplifying tweaks (Payment section) by payama admin AJAX Freelance Jobs 0 09-10-2008 08:05 AM
AJAX Jobs : phpfox copy of blog section by WinterPetals admin AJAX Freelance Jobs 0 09-06-2008 10:52 PM
What can I do to make the height of this div work out using CSS? drshorty XHTML and CSS 0 10-31-2007 08:15 PM


All times are GMT -4. The time now is 08:42 AM.


Powered by vBulletin® Version 3.7.3
Copyright ©2000 - 2009, Jelsoft Enterprises Ltd.
SEO by vBSEO 3.2.0 RC5
Copyright ©2006 - 2008, AJAXwith.com