473,803 Members | 3,422 Online
Bytes | Software Development & Data Engineering Community
+ Post

Home Posts Topics Members FAQ

How to make divs reach edges of browser window?

I have looked and looked and not found the answer to this one - just
lots of references to this or that "hack" that is supposed to fix the
problem (and it is a problem to some people).

If I have a div specified and want it to reach across the full width
of the browser window, it doesn't. There is an approximately 10-pixel
margin on either end of the div. I can "fix" this by setting my left
and right margins to -10px, but by doing so, I get the feeling that
I'm doing something that was never intended.

So first, why DON'T div's naturally, as far as I can tell, touch the
edges of the browser window. And second, what is the right/best/
least worst/"correct" way to make them touch the browser window edges.

See the following html:

<html>
<head>

<style type="text/css">
<!--
..bluearea {
margin: 0px;
padding: 5px;
width: auto;
color: white;
background-color: blue;
}
..redarea {
margin-left: -10px;
margin-right: -10px;
padding: 5px;
width: auto;
color: white;
background-color: red;
}
-->
</style>

</head>
<body>

<div class="bluearea ">
Why does this blue band not touch the edges of the browser window?
</div>

<div class="redarea" >
While this red band does?
</div>

</body>
</html>

Jul 20 '05 #1
18 10682
puzzled wrote:
I have looked and looked and not found the answer to this one - just
lots of references to this or that "hack" that is supposed to fix the
problem (and it is a problem to some people).

If I have a div specified and want it to reach across the full width
of the browser window, it doesn't. There is an approximately 10-pixel
margin on either end of the div. I can "fix" this by setting my left
and right margins to -10px, but by doing so, I get the feeling that
I'm doing something that was never intended.

So first, why DON'T div's naturally, as far as I can tell, touch the
edges of the browser window. And second, what is the right/best/
least worst/"correct" way to make them touch the browser window edges.


body {margin:0, padding:0;}

--
William Tasso - http://WilliamTasso.com
Jul 20 '05 #2
in post <news:le******* *************** **********@4ax. com>
puzzled said:
If I have a div specified and want it to reach across the full width
of the browser window, it doesn't.


body{margin:0;p adding:0;}

<div>100%</div>
--
brucie
Jul 20 '05 #3
body{margin:0;p adding:0;}

+-------

Thanks people. I swear I spent three hours trying to find the answer
before posting.
Jul 20 '05 #4
DU
puzzled wrote:
body{margin:0;p adding:0;}

+-------

Thanks people. I swear I spent three hours trying to find the answer
before posting.

Important and unknown default browser values:
http://www10.brinkster.com/doctorunc...ultValues.html

DU
Jul 20 '05 #5
It seems "DU" wrote in comp.infosystem s.www.authoring.stylesheets in
article <bt**********@n ews.eusc.inter. net>:

Important and unknown default browser values:
http://www10.brinkster.com/doctorunc...ultValues.html


I guess they really _are_ unknown. I visited the above page and got
"unknow [sic] or not available" for every one except the one labeled
MSIE, which said "not available".

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
2.1 changes: http://www.w3.org/TR/CSS21/changes.html
validator: http://jigsaw.w3.org/css-validator/
Jul 20 '05 #6
rf

"DU" <dr*******@hotR EMOVETHISmail.c om> wrote in message
news:bt******** **@news.eusc.in ter.net...
Important and unknown default browser values:

http://www10.brinkster.com/doctorunc...ultValues.html

<grin>
The daily bandwidth limit for this customer has been exceeded. Try again
after midnight, EST.
</grin>

Ah, but what EST? I'll just bet it means eastern standard USA time, not EST
Australia :-)

Cheers
Richard.
Jul 20 '05 #7
It seems "rf" wrote in comp.infosystem s.www.authoring.stylesheets in
article <Kh************ ****@news-server.bigpond. net.au>:

Ah, but what EST? I'll just bet it means eastern standard USA time, not EST
Australia :-)
That's AEST not EST, according to
http://www.koalanet.com.au/wtzabb.html
Note what country hosts that page.
http://www.cisco.com/en/US/products/...0800a938e.html

seems to be a complete list. Anyone know where (or if) there's an
ISO standard list on line?

--
Stan Brown, Oak Road Systems, Cortland County, New York, USA
http://OakRoadSystems.com/
HTML 4.01 spec: http://www.w3.org/TR/html401/
validator: http://validator.w3.org/
CSS 2 spec: http://www.w3.org/TR/REC-CSS2/
2.1 changes: http://www.w3.org/TR/CSS21/changes.html
validator: http://jigsaw.w3.org/css-validator/
Jul 20 '05 #8
Stan Brown wrote:
It seems "rf" wrote in comp.infosystem s.www.authoring.stylesheets in
article <Kh************ ****@news-server.bigpond. net.au>:

Ah, but what EST? I'll just bet it means eastern standard USA time, not EST
Australia :-)


That's AEST not EST, according to
http://www.koalanet.com.au/wtzabb.html
Note what country hosts that page.


When I lived in Sydney, the time zone was always referred to as EST.

Currently though, I am on GMT.

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

Jul 20 '05 #9
Stan Brown wrote:
Anyone know where (or if) there's an ISO standard list on line?


Names of timezones have never been standardised, but a good
pseudo-standard might be the table in getdate.c, part of the GNU
"sh-utils" package.

The table is reproduced below, and may be distributed under the GPL.
http://www.gnu.org/copyleft/gpl.html

/* The time zone table. This table is necessarily incomplete, as time
zone abbreviations are ambiguous; e.g. Australians interpret "EST"
as Eastern time in Australia, not as US Eastern Standard Time.
You cannot rely on getdate to handle arbitrary time zone
abbreviations; use numeric abbreviations like `-0500' instead. */
static table const time_zone_table[] =
{
{ "GMT",tZONE , HOUR ( 0) },/* Greenwich Mean */
{ "UT",tZONE, HOUR ( 0) },/* Universal (Coordinated) */
{ "UTC",tZONE , HOUR ( 0) },
{ "WET",tZONE , HOUR ( 0) },/* Western European */
{ "WEST",tDAYZONE , HOUR ( 0) },/* Western European Summer */
{ "BST",tDAYZ ONE, HOUR ( 0) },/* British Summer */
{ "ART",tZONE , -HOUR ( 3) },/* Argentina */
{ "BRT",tZONE , -HOUR ( 3) },/* Brazil */
{ "BRST",tDAYZONE , -HOUR ( 3) },/* Brazil Summer */
{ "NST",tZONE , -(HOUR ( 3) + 30) },/* Newfoundland Standard */
{ "NDT",tDAYZ ONE,-(HOUR ( 3) + 30) },/* Newfoundland Daylight */
{ "AST",tZONE , -HOUR ( 4) },/* Atlantic Standard */
{ "ADT",tDAYZ ONE, -HOUR ( 4) },/* Atlantic Daylight */
{ "CLT",tZONE , -HOUR ( 4) },/* Chile */
{ "CLST",tDAYZONE , -HOUR ( 4) },/* Chile Summer */
{ "EST",tZONE , -HOUR ( 5) },/* Eastern Standard */
{ "EDT",tDAYZ ONE, -HOUR ( 5) },/* Eastern Daylight */
{ "CST",tZONE , -HOUR ( 6) },/* Central Standard */
{ "CDT",tDAYZ ONE, -HOUR ( 6) },/* Central Daylight */
{ "MST",tZONE , -HOUR ( 7) },/* Mountain Standard */
{ "MDT",tDAYZ ONE, -HOUR ( 7) },/* Mountain Daylight */
{ "PST",tZONE , -HOUR ( 8) },/* Pacific Standard */
{ "PDT",tDAYZ ONE, -HOUR ( 8) },/* Pacific Daylight */
{ "AKST",tZON E, -HOUR ( 9) },/* Alaska Standard */
{ "AKDT",tDAYZONE , -HOUR ( 9) },/* Alaska Daylight */
{ "HST",tZONE , -HOUR (10) },/* Hawaii Standard */
{ "HAST",tZON E, -HOUR (10) },/* Hawaii-Aleutian Standard */
{ "HADT",tDAYZONE , -HOUR (10) },/* Hawaii-Aleutian Daylight */
{ "SST",tZONE , -HOUR (12) },/* Samoa Standard */
{ "WAT",tZONE , HOUR ( 1) },/* West Africa */
{ "CET",tZONE , HOUR ( 1) },/* Central European */
{ "CEST",tDAYZONE , HOUR ( 1) },/* Central European Summer */
{ "MET",tZONE , HOUR ( 1) },/* Middle European */
{ "MEZ",tZONE , HOUR ( 1) },/* Middle European */
{ "MEST",tDAYZONE , HOUR ( 1) },/* Middle European Summer */
{ "MESZ",tDAYZONE , HOUR ( 1) },/* Middle European Summer */
{ "EET",tZONE , HOUR ( 2) },/* Eastern European */
{ "EEST",tDAYZONE , HOUR ( 2) },/* Eastern European Summer */
{ "CAT",tZONE , HOUR ( 2) },/* Central Africa */
{ "SAST",tZON E, HOUR ( 2) },/* South Africa Standard */
{ "EAT",tZONE , HOUR ( 3) },/* East Africa */
{ "MSK",tZONE , HOUR ( 3) },/* Moscow */
{ "MSD",tDAYZ ONE, HOUR ( 3) },/* Moscow Daylight */
{ "IST",tZONE , (HOUR ( 5) + 30) },/* India Standard */
{ "SGT",tZONE , HOUR ( 8) },/* Singapore */
{ "KST",tZONE , HOUR ( 9) },/* Korea Standard */
{ "JST",tZONE , HOUR ( 9) },/* Japan Standard */
{ "GST",tZONE , HOUR (10) },/* Guam Standard */
{ "NZST",tZON E, HOUR (12) },/* New Zealand Standard */
{ "NZDT",tDAYZONE , HOUR (12) },/* New Zealand Daylight */
{ 0, 0, 0 }
};

--
Toby A Inkster BSc (Hons) ARCS
Contact Me - http://www.goddamn.co.uk/tobyink/?page=132

Jul 20 '05 #10

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

Similar topics

4
7953
by: metalseb | last post by:
Hi folks I built up a small website which is designed for 800x600 display. Runs just fine in this resolution but if you have a system in 1024 or 1280 pixels wide, the site just "sticks" in the upper-left corner of the browser window. So I'm trying to keep it horizontally centered whatever screen resolution you are set in. I do not want to deal with table cells, just CSS. I think that I must have a three column DIV layout with the...
20
7944
by: Mandy Memphis | last post by:
If I perform a mousedown within a document, move the mouse outside the browser window, and then release the mouse button, the document.onmouseup event does not fire. Is there any way to detect a mouseup event outside the document? Also, how can I get the relative coordinates of the cursor while it is outside the browser? Thank you.
8
8904
by: jrefactors | last post by:
I want to maximize the browser window when I open a new window. Now I do the following, but different monitor size will yield different width and height values. window.open('index.jsp',myform.target,'toolbar=no,menubar=no,resizable=yes,scrollbars=yes,width=800,height=600'); Any ideas? please help. thanks!!
10
11624
by: santiago538 | last post by:
Hi, Is there any way to specify which monitor a Window.open() will launch a new browser window in on systems with more than one display. It would only need to work with Mozilla browsers, and not IE. Thanks!
7
1700
by: Simon Storr | last post by:
The Microsoft CRM has custom combo boxes and date calendar controls that pop up outside the current window in a floating panel (they DON'T open a sub window in the normal way - there's no title bar for a start). How do they do it? I want to do the same thing in my web app but can't find any info on how to do it... Anyone know how its done!? Thanks, Simon
3
6467
by: Jimmy | last post by:
Is it possible to open a pop-up browser window (modal-style) inside another browser? e.g. // assuming something is calling this function inside the html as some event got triggered function doSomethingInDiffWindow() { // do something // open up a pop-up modal window // continue back on doing something after pop-up modal window
8
1548
by: =?Utf-8?B?Z3V5?= | last post by:
I have done this loads of time, but need a reminder - how do i load up a new browser window from code? (Brain is fried - i have been doing Winforms!) Guy
0
1972
gauchomatt
by: gauchomatt | last post by:
I have a liquid site which expands perfectly when the browser window is larger than the actual content. However, when I decrease the browser window size to a point that it's smaller horizontally than the content, my background div's and their images start to decrease horizontally. I think it has something to do with my #main div as well as my #wrap div's. They are the ones decreasing horizontally and eliminating everything in their path...
0
9703
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, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look ! Part I. Meaning of...
0
9565
by: Hystou | last post by:
Most computers default to English, but sometimes we require a different language, especially when relocating. Forgot to request a specific language before your computer shipped? No problem! You can effortlessly switch the default language on Windows 10 without reinstalling. I'll walk you through it. First, let's disable language synchronization. With a Microsoft account, language settings sync across devices. To prevent any complications,...
0
10550
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, it seems that the internal comparison operator "<=>" tries to promote arguments from unsigned to signed. This is as boiled down as I can make it. Here is my compilation command: g++-12 -std=c++20 -Wnarrowing bit_field.cpp Here is the code in...
0
10317
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 tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth. The Art of Business Website Design Your website is...
0
10069
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 protocol has its own unique characteristics and advantages, but as a user who is planning to build a smart home system, I am a bit confused by the choice of these technologies. I'm particularly interested in Zigbee because I've heard it does some...
0
9125
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, and deployment—without human intervention. Imagine an AI that can take a project description, break it down, write the code, debug it, and then launch it, all on its own.... Now, this would greatly impact the work of software developers. The idea...
1
7604
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM). In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules. He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms. Adolph will...
0
5501
by: TSSRALBI | last post by:
Hello I'm a network technician in training and I need your help. I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs. The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols. I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
2
3799
muto222
by: muto222 | last post by:
How can i add a mobile payment intergratation into php mysql website.

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.