Page 1 of 1

problem with over-riding a style decalration

Posted: Sat Feb 03, 2007 3:41 pm
by garry27
i've got this page which displays the login box properly in firefox but not in ie.
the right column is referenced by an id as are the child elements contained within this div.

when i try to override the styles that are inheritted, as in the case of the box for the login dive, IE ignores these styles and uses the #index-right-coln div styles instead of the new id i've declared for thelogin box.

here's the link: http://www.nl-webspace.co.uk/~unn_p921847/s2/

is this some sort of bug with IE and is there a work around?

TIA

Posted: Sat Feb 03, 2007 6:31 pm
by califdon
It would help if you would describe what you are trying to do. I do see some difference in IE and FF, primarily a horizontal line and a copyright 2007 statement.

Posted: Sat Feb 03, 2007 7:41 pm
by garry27
feyd | Please use

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]


i want to give #login-box1 its own styles. separate from the ones that are been cascaded by #index-right-coln. unfortunately the login div (#login-box1) is inheriting the div styles from #index-right-coln:

[syntax="css"]#index-right-coln div {	  /* bordered box */
  margin: 0 10px 10px 10px;
  color: #000000;
  background-color: #FFE6CC;
  border: 1px solid #FF4C29;
  font-family: arial, Helvetica, sans-serif;
  	
}
instead of over-ruling them with it's own styles:

Code: Select all

#login-box1{  /*box*/
  font-family: Verdana, Helvetica, sans-serif; 
  margin: 0 10px 10px 10px;
  color: #000000;
  background-color: #ffffff;	
  border: 1px solid #000099;		
}
incidently, all tags that cascade down from #login-box1 adopt their own styles and over rule old ones, which is a bit odd.

in my firefox browser, the login box shows up with the same styles as the other boxes in the right hand column:

http://www.nl-webspace.co.uk/~unn_p921847/s2/


feyd | Please use[/syntax]

Code: Select all

,

Code: Select all

and [syntax="..."] tags where appropriate when posting code. Your post has been edited to reflect how we'd like it posted. Please read:  [url=http://forums.devnetwork.net/viewtopic.php?t=21171]Posting Code in the Forums[/url] to learn how to do it too.[/color]

Posted: Sat Feb 03, 2007 7:54 pm
by superdezign
Sounds like the result of a typo. You might have typed the id incorrectly, closed the div tage too early, or not at all. But it sounds like a typo to me.

Posted: Sat Feb 03, 2007 10:05 pm
by nickvd
It's not a typo.. it's the specificity rules... i won't get into detail other than to suggest the reading of this link: http://www.htmldog.com/guides/cssadvanced/specificity/

Posted: Sun Feb 04, 2007 1:48 am
by garry27
thanks, guys.

i'll give that specifics rule another read.