473,405 Members | 2,421 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,405 software developers and data experts.

how to extent divs to full height of viewport

dear group,

as nobody answered my recent posts (maybe they were too complicated) i
just ask you to help me on a rather simple issue: how can i stretch
divs to the full height of the viewport (in my case the browser
window)?

any help will be appreciated.
--
kind regards,
tomasio
"describing an issue reveals the way to solve it"
Jul 20 '05 #1
2 5891
tomasio <da****@jan.et> wrote:
how can i stretch
divs to the full height of the viewport (in my case the browser
window)?


body{margin:0;padding:0}
html,body,div{height:100%}

--
Spartanicus
Jul 20 '05 #2
Spartanicus <me@privacy.net> schrieb:
tomasio <da****@jan.et> wrote:
how can i stretch
divs to the full height of the viewport (in my case the browser
window)?


body{margin:0;padding:0}
html,body,div{height:100%}

thank you spartanicus,

finally an answer ; )

I applied the CSS above to a test-html document, and it stretches to
full height of the viewport. Unluckily I am now confronted with two
issues:
1) There is an unwanted large amount of space between the signature
after the first article and the header of the second.
2) the margins to the left and right of the textbox (made them with a
background picture) - and at least in mozilla - its background color
don't stretch to the bottom of the viewport.

Is absolute positioning causing this behaviour?

I provided example html
(http://tomasio.laudatio.com/jobs/Cla...st_height.html) and css
(http://tomasio.laudatio.com/jobs/Cla...est_height.css) and a link
to the inital site (with the correct spacing between articles,
signatures and headers), which can be found here:
http://tomasio.laudatio.com/jobs/Cla..._template.html.

this is my final request for now, because i can finally go on with
building the site i am commissioned after solving the problems above
mentioned.
--
kind regards,
tomasio
"describing an issue reveals the way to solve it"
Jul 20 '05 #3

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

20
by: Firas D. | last post by:
http://firasd.org/ The divs of the 'box' class seem to have the effect I want in IE (namely: consistent height and horizontal alignment along the set of divs), but it totally falls apart in...
5
by: Secret Guy | last post by:
Because of my experience posting various places over the last couple of weeks: I'm expecting to be greated with hostility for asking about concepts instead of "practical" things, since that has...
20
by: Tyler Carver | last post by:
I would like to do something that seems so basic with two div's but I don't think it can be done. Tables can do it in a snap. I was convinced that css was the way to go for layout but without...
2
by: David Winter | last post by:
This is a totally trivial CSS problem, I'm sure, but I don't get it. I want a centered DIV with a fixed width between two other DIVs that should fill the rest of the window/viewport (= 100%). How...
12
by: deko | last post by:
Is there any way to work around the blank space created by hidden divs? I'm trying to use a relatively postioned divs with show/hide behaviors to annotate an image. The divs show/hide...
15
by: red | last post by:
How do I center two side by side divs ? I've been writing css pages for a while but there's one thing tha still eludes me. I can center a div with margin auto. I can place two divs side by side...
11
by: yawnmoth | last post by:
How do you get both of these div's to have a 100% width? (1): <div style="float: left; background: black; color: white">Hello, world! </div> <div style="clear: both; background: blue; color:...
12
by: daniel2335 | last post by:
This problem is everywhere! I have read all forums available, spent about 40+ hours on it and lost a bit of hair. I was going to explain what its ment to look like but I just realised removing the...
2
by: rigiditymodulus | last post by:
Hi - So, I had this working perfectly, then had a small crash (the transmitter for my wireless mouse occassionally freaks out my MacBook Pro) and when I rebooted and opened up my file the two...
0
by: Charles Arthur | last post by:
How do i turn on java script on a villaon, callus and itel keypad mobile phone
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
by: Hystou | last post by:
There are some requirements for setting up RAID: 1. The motherboard and BIOS support RAID configuration. 2. The motherboard has 2 or more available SATA protocol SSD/HDD slots (including MSATA, M.2...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...
0
tracyyun
by: tracyyun | last post by:
Dear forum friends, With the development of smart home technology, a variety of wireless communication protocols have appeared on the market, such as Zigbee, Z-Wave, Wi-Fi, Bluetooth, etc. Each...
0
agi2029
by: agi2029 | last post by:
Let's talk about the concept of autonomous AI software engineers and no-code agents. These AIs are designed to manage the entire lifecycle of a software development project—planning, coding, testing,...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.