CSS and Firefox - HTML / CSS

marc.birkett

Hello.

Quick question - if its in the wrong place please point me in the right
direction.

Does Firefox / Opera etc recognise CSS classes such as:

body#page1 #tab1{

}

i.e to match <body id="page1"><div ="tab1"></div></body>

My classes work fine in IE and not at all in Firefox / Opera - is this
a known issue and is there a work-around? or am i just being thick?

ta

marc

Aug 22 '05 #1

Subscribe Post Reply

2993

dingbat

marc.birk...@gmail.com wrote:

Does Firefox / Opera etc recognise CSS classes such as:

The browsers work. Your code is broken.

"#" indicates an id, not a class.

"<div ="tab1">" isn't valid anything.

Why do you need to identify the body element with an id?

Why would you need body in the CSS selector at all ? Unless you're
actually addressing the page canvas as the <body> itself, then
parentage from body is implicit in all HTML elements anyway.

It's rare (albeit sometimes needed, and always valid) to have a CSS
selector with nested ids. ids are unique and HTML is tree-structured
(i.e. only one path to any location in the document) - so why would you
ever need to select on the combination of two ids, not just on one ?

Working in IE is almost an invalidator, certainly not a validator.

What does this page look like? Post a URL, not a fragment.

Aug 22 '05 #2

Harlan Messinger

ma**********@gmail.com wrote:

Hello.

Quick question - if its in the wrong place please point me in the right
direction.

Does Firefox / Opera etc recognise CSS classes such as:

body#page1 #tab1{

}

i.e to match <body id="page1"><div ="tab1"></div></body>

My classes work fine in IE and not at all in Firefox / Opera - is this
a known issue and is there a work-around? or am i just being thick?

It's hard to imagine how even IE would recognize <div ="tab1">.

Aug 22 '05 #3

Harlan Messinger

di*****@codesmiths.com wrote:

marc.birk...@gmail.com wrote:

Does Firefox / Opera etc recognise CSS classes such as:

The browsers work. Your code is broken.

"#" indicates an id, not a class.

"<div ="tab1">" isn't valid anything.

Why do you need to identify the body element with an id?

There is at least one technique that involves assigning an ID to a page.
A class could be used too, but since the body is unique by definition,
and since IDs are given higher specificity in CSS than classes, it makes
sense to use an ID.

Aug 22 '05 #4

marc.birkett

Apols in my haste my example was incorrect.

Example selector: #body#page7 #tab3
Example in page:
<body id='page1'>
<div id="#menu">
<ul>
<li id='tab1'>
</li>
</ul>
</div>
</body>

A copy of the page is at:
http://194.216.112.248/staging.nnt.n...ift/index.aspx

The body needs a selector because i am attempting to do a css based
menu where the only difference between the pages is the id passed to it
on the querystring and therefore to the database.

I am aware that the fact that the css works in IE does not make it
correct.

Cheers.

Marc

Aug 22 '05 #5

Christoph Päper

ma**********@gmail.com:

Example selector: #body#page7 #tab3

Aug 22 '05 #6

Andy Dingley

On 22 Aug 2005 08:15:49 -0700, ma**********@gmail.com wrote:

Example selector: #body#page7 #tab3
Example in page:
<body id='page1'>
<div id="#menu">
<ul>
<li id='tab1'>
</li>
</ul>
</div>
</body>

Try fixing

<div id="menu">

Then using

body#page7 #tab3 { ... }

Or even
<li id="menu-tab1" >
and
#menu-tab1 { .. }

Nested stacks of ids is rarely needed and hard to maintain. If you keep
the names vaguely meaningful, then you can usually do it in one level of
selector.

If you need page-context sensitivity, then a common technique for menus
is <li class="current" > where needed, rather than tying particular
ids to particular pages.

Aug 22 '05 #7

Gérard Talbot

ma**********@gmail.com a écrit :

Apols in my haste my example was incorrect.

Example selector: #body#page7 #tab3
Example in page:
<body id='page1'>
<div id="#menu">
<ul>
<li id='tab1'>
</li>
</ul>
</div>
</body>

A copy of the page is at:
http://194.216.112.248/staging.nnt.n...ift/index.aspx

The body needs a selector because i am attempting to do a css based
menu where the only difference between the pages is the id passed to it
on the querystring and therefore to the database.

I am aware that the fact that the css works in IE does not make it
correct.

Cheers.

Marc

Marc, an id attribute value must be an unique attribute value.
Therefore, why would you need to create a css declaration like this
#body#page7 #tab3 {...css declarations...}
when
#tab3 {...css declarations...}
will do the same?

or
#tab3, #tab4, #tab5 {...css declarations...}

Gérard
--
remove blah to email me

Aug 23 '05 #8

'sNiek

Harlan Messinger schreef:

It's hard to imagine how even IE would recognize <div ="tab1">.

That could be a good start for IE-css-hacks :-)

--
Niek

Aug 23 '05 #9

dingbat

Gérard Talbot wrote:

an id attribute value must be an unique attribute value.

Not necessarily! It must be unique on a _page_, but there's no reason
it can't be repeated across a _site_. If the CSS is shared across
multiple pages, then there are situations when it's reasonable to use a
pair of ids in a CSS selector to recognise the case when they're
encoutered together - this might only occur on a few of the pages.

Aug 23 '05 #10

Danny

<ma**********@gmail.com> wrote in message
news:11**********************@o13g2000cwo.googlegr oups.com...

Hello.

Quick question - if its in the wrong place please point me in the right
direction.

Does Firefox / Opera etc recognise CSS classes such as:

body#page1 #tab1{

It does if you add a space between 'body' and '#page1'

Aug 23 '05 #11

Els

Danny@Kendal wrote:

<ma**********@gmail.com> wrote in message
news:11**********************@o13g2000cwo.googlegr oups.com...

Does Firefox / Opera etc recognise CSS classes such as:

body#page1 #tab1{

It does if you add a space between 'body' and '#page1'

body#page1 is not the same as body #page1

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vão. O resto é imperfeito.
- Renato Russo -
Now playing: Badlands - Winter's Call

Aug 23 '05 #12

marc.birkett

"A copy of the page is at:
http://194.216.112.248/staging .nnt.nhs.uk/nntlift/index.aspx "

Apologies. The link above now works.

ta

Aug 23 '05 #13

Danny

"Els" <el*********@tiscali.nl> wrote in message
news:2z**************@locusmeus.com...

Danny@Kendal wrote:
<ma**********@gmail.com> wrote in message
news:11**********************@o13g2000cwo.googlegr oups.com...

Does Firefox / Opera etc recognise CSS classes such as:

body#page1 #tab1{

It does if you add a space between 'body' and '#page1'

body#page1 is not the same as body #page1

Gerraway! :-)

What does "body#page1" mean anyway?

I thought it was invalid but I just fed it through
http://jigsaw.w3.org/css-validator and it accepted it.

Aug 23 '05 #14

Els

ma**********@gmail.com wrote:

"A copy of the page is at:
http://194.216.112.248/staging .nnt.nhs.uk/nntlift/index.aspx "

Apologies. The link above now works.

Are you sure? there is a space between staging and the rest of the
line.
I guess you meant
http://194.216.112.248/staging.nnt.n...ift/index.aspx

Looking at your source, "body#page1" should work as a selector.

How about changing the single quotes to double quotes on the IDs of
the list elements?

--
Els http://locusmeus.com/
Sonhos vem. Sonhos vÃ£o. O resto Ã© imperfeito.
- Renato Russo -
Now playing: L.A. Guns - The Ballad of Jane

Aug 23 '05 #15

Els

Danny@Kendal wrote:

"Els" <el*********@tiscali.nl> wrote in message
news:2z**************@locusmeus.com...
Danny@Kendal wrote:
<ma**********@gmail.com> wrote in message
news:11**********************@o13g2000cwo.googlegr oups.com...
Does Firefox / Opera etc recognise CSS classes such as:

body#page1 #tab1{

It does if you add a space between 'body' and '#page1'

body#page1 is not the same as body #page1

Gerraway! :-)

What does "body#page1" mean anyway?

It means any body element with an ID named page1.
I thought it was invalid but I just fed it through
http://jigsaw.w3.org/css-validator and it accepted it.

Here's another enlightening link for you ;-)
http://gallery.theopalgroup.com/selectoracle/
--
Els http://locusmeus.com/
Sonhos vem. Sonhos vÃ£o. O resto Ã© imperfeito.
- Renato Russo -
Now playing: L.A. Guns - The Ballad of Jane

Aug 23 '05 #16

Danny

"Els" <el*********@tiscali.nl> wrote in message
news:1a***************@locusmeus.com...

Danny@Kendal wrote:
"Els" <el*********@tiscali.nl> wrote in message
news:2z**************@locusmeus.com...
Danny@Kendal wrote:

<ma**********@gmail.com> wrote in message
news:11**********************@o13g2000cwo.googlegr oups.com...

> Does Firefox / Opera etc recognise CSS classes such as:
>
> body#page1 #tab1{

It does if you add a space between 'body' and '#page1'

body#page1 is not the same as body #page1
Gerraway! :-)

What does "body#page1" mean anyway?

It means any body element with an ID named page1.

Here's another enlightening link for you ;-)
http://gallery.theopalgroup.com/selectoracle/

Ah! Very interesting. Another link for the bookmarks.
Now to look up the definition of 'descendant' and 'child'...

Aug 23 '05 #17

marc.birkett

"How about changing the single quotes to double quotes on the IDs of
the list elements? "

Tried this with no effect (other than they are all " which is the way
it should be!). Going to experiment with assigning a current flag to
the parent li of the of the main menu.

Aug 23 '05 #18

marc.birkett

Now have another version of the site at:
http://194.216.112.248/staging.nnt.n...=8&trancheid=1

Where the CSS is much much better (and im happier with it). Now just
have to identify which <li> is the current one and cast its background
to white, foreground to black and we are sorted.

Shame it seems to be difficult with an asp.net repeater!

Aug 23 '05 #19

Johannes Koch

Danny@Kendal wrote:

Now to look up the definition of 'descendant' and 'child'...

You are a child of your parents. You are a descendant of your parents,
your grandparents, your great-grandparents, your ...

--
Johannes Koch
In te domine speravi; non confundar in aeternum.
(Te Deum, 4th cent.)

Aug 23 '05 #20

marc.birkett

Fixed version here:
http://194.216.112.248/staging.nnt.n....aspx?pageid=1

cheers people!

ta

Aug 23 '05 #21

kchayka

ma**********@gmail.com wrote:

Fixed version here:
http://194.216.112.248/staging.nnt.n....aspx?pageid=1

Fixed in what way?
http://validator.w3.org/check?verbos...x%3Fpageid%3D1

There are 32 HTML errors, for starters, including at least 1 duplicate
ID. The CSS seems to validate, but the HTML errors may still cause
rendering issues.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

Aug 23 '05 #22

marc.birkett

dont have an issue wit the html errors for the moment. just getting the
css to work, then i will worry about that....

Aug 24 '05 #23

dingbat

ma**********@gmail.com wrote:

dont have an issue wit the html errors for the moment. just getting the
css to work, then i will worry about that....

Totally the wrong attitude (have you read _nothing_ in this group?)

Your CSS engine can't work reliably with broken inputs, either HTML or
CSS. If you expect to debug some layout screwup, you _MUST_ fix the
simple validation errors first.

Not all invalidity errors will cause problems. But there is no reliable
way of telling which will and which won't, so the easiest route is to
fix the lot first.

Or even better, don't write invalid code to begin with. This is quicker
and easier than the "fix it all afterwards" approach.

Aug 24 '05 #24

Alan J. Flavell

On Wed, 24 Aug 2005, di*****@codesmiths.com revealed to discerning
readers that:

ma**********@gmail.com wrote:
dont have an issue wit the html errors for the moment. just
getting the css to work, then i will worry about that....

Well, I plonked *@gmail.com for widespread disregard of netiquette,
but it seems there are other good reasons too.
Totally the wrong attitude (have you read _nothing_ in this group?)

Well said.

Aug 24 '05 #25

marc.birkett

"Or even better, don't write invalid code to begin with. This is
quicker
and easier than the "fix it all afterwards" approach. "

Agreed - but equally i am used to writing ASP.NET code which will then
render non-accessible HTML later anyway. The fact that the layout
problems may be caused by the html rather than the css is a good point
which i had not considered.

"...@gmail.com for widespread disregard of netiquette, "

please feel free to point out my failures of netiquette.

Thanks.

marc

Aug 25 '05 #26

marc.birkett

http://194.216.112.248/staging.nnt.n....aspx?pageid=1

Ok. I think that this is ready to go. Constructive comments welcome.

Thanks for your help everyone.

Cheers,

Marc

Aug 25 '05 #27

Beauregard T. Shagnasty

ma**********@gmail.com wrote:

http://194.216.112.248/staging.nnt.n....aspx?pageid=1

Ok. I think that this is ready to go. Constructive comments
welcome.

a. Doesn't fit in my browser window, requiring me to scroll right just
to see your content.
b. Has a very large unused space at the left ... (scrolls right) ...
aha, another one over there.
c. Has a really ugly aqua background color. [1]
d. Font seems too small. Must be those font "words" instead of the
better usage of percentages. (Content should be font-size: 100%; )

That's all I have time for at the moment.

[1] That's my default background color; you didn't assign one.

--
-bts
-This space intentionally left blank.

Aug 25 '05 #28

dingbat

ma**********@gmail.com wrote:

don't write invalid [HTML] code to begin with.

Agreed - but equally i am used to writing ASP.NET code which will then
render non-accessible HTML later anyway.

Then fix your ASP so that it makes valid code (and (optionally) it
should make well-indented code with linebreaks and comments too).
Automatically generated rubbish can swamp any attempt to debug it by
eyeball - you need all the help you can get.

To fix your CSS problems, capture the ASP output, then store that as
static HTML and debug that as a simple static HTML/CSS problem. If
you're using XSLT to generate output then this is particularly
necessary, as XSLT's one-line character spew can be a real nightmare to
try and tart up without getting to look at the intermediate stages.

Aug 25 '05 #29

kchayka

ma**********@gmail.com wrote:

please feel free to point out my failures of netiquette.

4 come to mind off the bat...

1. Failure to properly quote text.

2. Failure to properly attribute text that is quoted (in that awful way
of manual quoting you are using). If you insist on using google groups
to post, at least learn how to use the blasted thing!

3. Failure to lurk in the group for a while before posting. If you had,
you would have already seen the subject of posting come up many times.

4. Failure to take advantage of google groups as it was meant to be
used, as a searchable archive. If you had searched for the subject of
netiquette you should have found your own answers quick enough.

All of the above are common failures of those who post through google
groups. It's no wonder google is mass killfiled by so many usenet
regulars. Do yourself and everyone else a favor: get yourself a real
newsreader and dump google groups.

--
Reply email address is a bottomless spam bucket.
Please reply to the group so everyone can share.

Aug 25 '05 #30

Similar topics

Session data lost in Firefox

by: Jeremy Epstein | last post by:

I've got a 4-page form that lets users enter a whole lot of information, which is then submitted and emailed at the end. All the fields are stored as session data. The whole thing works fine: ...

PHP

field.focus() in Firefox 0.8 >

by: Geoff | last post by:

When trying to focus a field in Firefox, I get the following error: Error: " nsresult: "0x8057001e (NS_ERROR_XPC_JS_THREW_STRING)" location: "JS frame ::...

Javascript

layer transparent Please HELP!!

by: expertware | last post by:

Dear friends, My name is Pamela, I know little about CSS, but I would like to ask a question I have an image on a web page within a css layer: <DIV ID=MyLayer STYLE = "position:...

HTML / CSS

FIREFOX 1.0.7 AND IE6 viewed through DATATIME: a summary REPORT

by: expertware | last post by:

Ok! to avoid confusion I will start a new argument. Thanks!! FIREFOX 1.0.7 AND IE6 viewed through DATATIME: a summary REPORT ===============================================================...

HTML / CSS

Firefox bug in webbrowser module on Ubuntu?!

by: SPE - Stani's Python Editor | last post by:

Hi, During optimizing SPE for Ubuntu, I found something strange. I have Ubuntu 5.10 "The Breezy Badger" and unfortunately this code is not working: >>> import webbrowser >>>...

Python

Javascript code not running in FIREFOX

by: Coder | last post by:

Hi I have the following code in java script, it is not giving proper output in FIREFOX but running fine in IE... can anybody help me out to make this run in FIREFOX . <script...

Javascript

A question on Firefox

by: amit | last post by:

Hello group, I'm kinda skeptical about a code is being used in my js program. All it does is checking what browser is being run and finds out if FLASH is installed or not. This code works...

Javascript

Javascript Variables and Firefox

by: scotty | last post by:

I have a script that loops through an existing table list and prepares each href element node to trigger a function when an image is clicked. The function that will be run passes a property value...

Javascript

Visual Studio 2008 (Orcas)'s ClickOnce with Firefox

by: Carlos Mendonça | last post by:

Has anyone managed to get ClickOnce to work with Firefox? It seems to me that it still has the same issues VS 2K5 had. I appreciate any comments or tips.

.NET Framework

munged rendering in Firefox ASP.NET 2.0

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...

ASP.NET

Migrating Website to Cloud - Emmanuel Katto

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

General

Navigating the Data Structures and Algorithms (DSA)

by: BarryA | last post by:

What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...

Algorithms / Advanced Math

Looking to do Android software development, any suggestions? Is flutter better?

by: nemocccc | last post by:

hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?

General

Is that possible of reading the .csv file in column wise and the column have different lengths ?

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...

C / C++

How to build RAID in BIOS?

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...

Computer Hardware

What is ONU?

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,...

General

Changing the language in Windows 10

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...

Windows Server

Maximizing Business Potential: The Nexus of Website Design and Digital Marketing

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...

Online Marketing

Discussion: How does Zigbee compare with other wireless protocols in smart home applications?

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...

General