473,324 Members | 2,193 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,324 software developers and data experts.

Firefox - width

8
Hi

I've a problem viewing my webpage with Firefox.
I've defined a box, 780px wide and given it a background colour.
The problem with Firefox is that only that part of the box containing information
is given the background colour, not the whole 780px.
Explorer shows the page as I intended.
What can I do?
Nov 16 '06 #1
9 2086
steven
143 100+
Can we see the code in question please?
Nov 16 '06 #2
drhowarddrfine
7,435 Expert 4TB
Yes, need the code to see specifics but the problem is not Firefox. It's an IE bug that causes it to extend elements to contain floated or absolutely positioned content. Firefox is performing correctly. Chances are, adding overflow:auto; to the containing elements CSS will do what you want.

Just remember the mantra: if it works in old, buggy non-standard IE but not other browsers then the code is wrong.
Nov 16 '06 #3
wr657
8
Here's the code:

.box {
background-color: #FFE4C4;
width: 780px;
}
Nov 16 '06 #4
wr657
8
I've added, as recommended, overflow: auto to the code.
It worked to a certain extent, but not completely.
Nov 16 '06 #5
drhowarddrfine
7,435 Expert 4TB
The code you showed is like reading one sentence of a book. We need the whole thing or, preferably, a link.
Nov 17 '06 #6
wr657
8
The address is http://www.bomloveven.com/test.html

Here follows the css-code. I have omitted code wich I don't consider having
consequenses for the problem. The code is mainly norwegian words, but I have
added some english explanation in the html-code. If it would
be easier for you to get the perspective I will translate them.

[#aktiv {
PADDING-LEFT: 2em;
PADDING-RIGHT: 2em;
PADDING-TOP: 0.4em;
PADDING-BOTTOM: 0.4em;
BORDER-RIGHT: #3399cc 1px solid;
BORDER-TOP: #3399cc 1px solid;
BORDER-LEFT: #3399cc 1px solid;
BORDER-BOTTOM: #3399cc 1px solid;
TEXT-DECORATION: none;
background-color: #FFE4C4;
COLOR: Black;
MARGIN-RIGHT: 1em;}

.boks {
background-color: #FFE4C4;
width: 780px;
overflow: auto;}

div.container {
width: 100%;
line-height: 100%;}


div.venstre {
text-align: left;
background-color: #FFE4C4;
font-size: 1em;
float:left;
width:10em;
margin:0em;
padding-top:1em;
padding-left: 0.5em;
padding-bottom: 1em;}

#meny {
BORDER-RIGHT: #3399cc 1px solid;
BORDER-TOP: #3399cc 1px solid;
BORDER-LEFT: #3399cc 1px solid;
BORDER-BOTTOM: #3399cc 1px solid;
BACKGROUND: #cc9999;
padding-RIGHT: 0px;
padding-LEFT: 0px;
PADDING-BOTTOM: 0px;
MARGIN: 0px;
FONT: 70% Verdana, Helvetica, sans-serif;
WIDTH: 13em;
PADDING-TOP: 0px;
LIST-STYLE-TYPE: none;
LETTER-SPACING: 0.1em;
DISPLAY: block;
HEIGHT: 100%;
TEXT-DECORATION: none:
text-align: left;}

#meny LI {
MARGIN-BOTTOM: 0.25em;}

#meny A {
BORDER-RIGHT: #996666 1px solid;
PADDING-RIGHT: 0.25em;
BORDER-TOP: #996666 1px solid;
DISPLAY: block;
PADDING-LEFT: 0.25em;
BACKGROUND: #FF9F9F;
PADDING-BOTTOM: 0.25em;
BORDER-LEFT: #996666 1px solid;
WIDTH: auto;
PADDING-TOP: 0.25em;
BORDER-BOTTOM: #996666 1px solid;
HEIGHT: 100%;
TEXT-DECORATION: none:}

#menycontainer UL {
MARGIN: 2em;
FONT: 70% Verdana, Helvetica, sans-serif;
TEXT-ALIGN: center;}

#menycontainer LI {
DISPLAY: inline;
LIST-STYLE-TYPE: none;}

#menycontainer LI A {
PADDING-LEFT: 2em;
PADDING-RIGHT: 2em;
PADDING-TOP: 0.4em;
PADDING-BOTTOM: 0.4em;
BORDER-RIGHT: #3399cc 1px solid;
BORDER-TOP: #3399cc 1px solid;
BORDER-LEFT: #3399cc 1px solid;
BORDER-BOTTOM: #3399cc 1px solid;
BACKGROUND: #FF9F9F;
MARGIN-RIGHT: 1em;
TEXT-DECORATION: none;
COLOR: Black;}

.undertopp {
width: 780px;
background: Black;
padding-left: 1em;
padding-right: 1em;
padding-bottom: 0.1em;
padding-top: 0.1em;
text-align: center;}]
Nov 17 '06 #7
drhowarddrfine
7,435 Expert 4TB
Add overflow:auto; to .box and that solves the problem.

You have another issue. Your doctype is incorrect. New pages should be created using this one:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">

Also, you should get in the habit of using lower case in your tags. HTML doesn't care but XHTML does. CSS does, too.

Changing to a strict doctype may change the appearance of your page forcing you to recode something but you should be coding in strict anyway.

In addition, you are using the xml declaration: <?xml version="1.0" encoding="iso-8859-1"?> but you aren't using XML. It should be the first line of your code but you aren't using XML anyway so you should remove it. On top of that, only modern browsers handle it properly while IE will choke on it and go into 'quirks' mode.

Also, because you are not using XML, you should not try using XML Namespaces. Change this: <html xmlns="http://www.w3.org/1999/xhtml"> to <html>

After all that, validate your html and css to check for other errors.
Nov 17 '06 #8
wr657
8
I have added overflow : auto to the code. That is helping a bit but not enough.
I have made a page called test.html. When I open this file in Firefox, there are
still some pixels to fill with the right background colour; as far as to the end
of the black top.

If uou visit http://www.bomloveven.com/test.html you may
see what I mean.

I have removed the xml declaration, but I wonder it there's a xhtml declaration to
use?
Nov 24 '06 #9
drhowarddrfine
7,435 Expert 4TB
No, there is no xhtml declaration like the xml one. Also, IE does not even support xhtml served as xhtml.

I don't see where you changed any of the other things I mentioned above and you only moved the xml declaration to an illegal place.
Nov 24 '06 #10

Sign in to post your reply or Sign up for a free account.

Similar topics

2
by: Stewart | last post by:
Originally posted in comp.lang.javascript: Newsgroups: comp.lang.javascript From: "Stewart" Date: 23 Aug 2005 02:50:04 -0700 Local: Tues, Aug 23 2005 10:50 am Subject: FireFox, RemoveChild,...
3
by: niconedz | last post by:
Hi The following code works fine in IE but not Firefox. It's a little script that zooms an image and resizes the window to fit. Can anybody tell me what's wrong? Thanks Nico == btw.....
2
by: cbjewelz | last post by:
Hey all. So I'm having problems with cross browser alignments. I'm looking at Safari and Mozilla Firefox. I develop in Safari and so it looks perfect there however in Firefox my vertical...
7
by: Xah Lee | last post by:
Look at this page http://xahlee.org/emacs/wrap-url.html Look at it in Firebox, look at it in Safari, in Opera, and look at it in Microsoft Internet Explorer. The only fucked up case, is...
12
by: tim | last post by:
I am using foldoutmenu 3 and am having problems with viewing my menus in firefox. On my sub3 menus i have more than one line of text in some places. firefox does not recognise that there is more...
3
by: autospanker | last post by:
Ladies and Gentleman, I have been having this problem that has been driving me insane. I have a website that when viewed in Firefox first, the content in the body area is pushed down. Then when...
3
by: töff | last post by:
On my site http://www.sjcga.com I have a javascript-generated navigation menu in the top right corner. The menu works great in IE and Opera ... but in FireFox, on the 1st click, the menu jumps...
11
by: davecph | last post by:
I'm constructing a website with a layout created with div-tags. They have a fixed width, float left, and display inline. When one of the div's contain a select-element the right-most div floats down...
1
by: littlealex | last post by:
IE6 not displaying text correctly - IE 7 & Firefox 3 are fine! Need some help with this as fairly new to CSS! In IE6 the text for the following page doesn't display properly - rather than being...
3
by: SAL | last post by:
Hello, I did google this issue and found some stuff related to BrowserCaps section of either web.config or machine.config but it didn't work. It seems that most pages in my webapp are okay but a...
0
by: DolphinDB | last post by:
Tired of spending countless mintues downsampling your data? Look no further! In this article, you’ll learn how to efficiently downsample 6.48 billion high-frequency records to 61 million...
0
isladogs
by: isladogs | last post by:
The next Access Europe meeting will be on Wednesday 6 Mar 2024 starting at 18:00 UK time (6PM UTC) and finishing at about 19:15 (7.15PM). In this month's session, we are pleased to welcome back...
0
by: Vimpel783 | last post by:
Hello! Guys, I found this code on the Internet, but I need to modify it a little. It works well, the problem is this: Data is sent from only one cell, in this case B5, but it is necessary that data...
0
by: ArrayDB | last post by:
The error message I've encountered is; ERROR:root:Error generating model response: exception: access violation writing 0x0000000000005140, which seems to be indicative of an access violation...
1
by: PapaRatzi | last post by:
Hello, I am teaching myself MS Access forms design and Visual Basic. I've created a table to capture a list of Top 30 singles and forms to capture new entries. The final step is a form (unbound)...
1
by: Shællîpôpï 09 | last post by:
If u are using a keypad phone, how do u turn on JavaScript, to access features like WhatsApp, Facebook, Instagram....
0
by: af34tf | last post by:
Hi Guys, I have a domain whose name is BytesLimited.com, and I want to sell it. Does anyone know about platforms that allow me to list my domain in auction for free. Thank you
0
by: Faith0G | last post by:
I am starting a new it consulting business and it's been a while since I setup a new website. Is wordpress still the best web based software for hosting a 5 page website? The webpages will be...
0
isladogs
by: isladogs | last post by:
The next Access Europe User Group meeting will be on Wednesday 3 Apr 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 former...

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.