By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
437,648 Members | 1,199 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 437,648 IT Pros & Developers. It's quick & easy.

confused about syntax

P: 16
I am confused about the syntax used in the style sheet that accompanies the website I've inherited and have been asked to tidy up. XHTML is new to me, and I've only used CSS for font and link styles in the past.

The style sheet includes such things as div#header. Is this correct? I thought it should be either div header or #header. I can't find any reference to this online.

Also, the html references two style sheets in addition to the one for IE. One is called 'layout.css' and the other is 'themes/index.css'. 'themes/index.css' seems to be some kind of template with only a few things in it.

Here's the top of the html page I have asked in a separate thread whether the DTD and html bits are correct or not as they seem to be different from the W3c recommendation:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xml:lang="en">


<head>

<title>...</title>

<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="MSSmartTagsPreventParsing" content="TRUE" />
<meta http-equiv="expires" content="-1" />
<meta http-equiv= "pragma" content="no-cache" />
<meta name="Author" content="... Copyright 2006 ..." />
<meta name="keywords" content="..." />
<meta name="description" content="..." />

<link href="images/favicon.ico" rel="shortcut icon" />


<link href="css/layout.css" rel="stylesheet" type="text/css" media="screen" />

<link href="css/themes/index.css" rel="stylesheet" type="text/css" media="screen" />


<!--[if IE 6]>
<link rel="stylesheet" href="css/ie6work.css" type="text/css">
<![endif]-->


</head>

I have been trying to amalgamate 'index.css' and 'layout.css', but some of the property values in them seem to conflict (things such as 'position: fixed' and 'position: relative' for the same selector). Oh dearie me... Does the second style sheet referenced on the html page override the first one if there is a conflict? Has it been done for a reason? (I think maybe the designer uses a template called themes/index.css for all his pages as they do look very similar, and then writes a separate one for the details. Could that be the case here? Is it good practice?)

I can post style sheets and html if that will help, but they are works in progress and I did inherit a bit of a mess...

Thank you.

Helen
Jan 25 '07 #1
Share this Question
Share on Google+
2 Replies


drhowarddrfine
Expert 5K+
P: 7,435
Using div#header or #header is the same and only personal preference.

position:fixed does not work in IE6 at all. The second style sheet can override any attributes set in the first one.
Jan 25 '07 #2

P: 16
Thank you for the clarification. Well, I think I've managed to merge index.css and layout.css with, so far, no dire outcome. Now I have to see what happens when I put in the updated content...
Jan 25 '07 #3

Post your reply

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