homepage Welcome to WebmasterWorld Guest from 54.196.62.23
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / CSS
Forum Library, Charter, Moderators: not2easy

CSS Forum

    
width in css syntax
webdesignerq



 
Msg#: 3397 posted 11:34 am on Apr 11, 2004 (gmt 0)

#container {
width: 760px;
\width: 780px;
w\idth: 760px;
border: 1px solid gray;
margin: 10px;
margin-left: auto;
margin-right: auto;
padding: 10px;}

what is the diiference between width, \width and w\idth

 

webdesignerq



 
Msg#: 3397 posted 11:41 am on Apr 11, 2004 (gmt 0)

when to use <style type="text/css" media="screen, projection">
...
</style>

?

Rambo Tribble

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3397 posted 1:29 pm on Apr 11, 2004 (gmt 0)

The W3C's pages on CSS2 don't make any reference to the use of the \ character, to \width, or w\idth. It would appear to be an error. [w3.org...]

webdesignerq



 
Msg#: 3397 posted 1:41 pm on Apr 11, 2004 (gmt 0)

[aplus.co.yu...] there I found it in adx menu 2 css coding

it has to do with crossbrowser code, 800*600 design meaning that the minimum width of the browser window may differ.

Rambo Tribble

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3397 posted 2:19 pm on Apr 11, 2004 (gmt 0)

Characteristically, the way screen width is determined is through the JavaScript window.screen.availWidth property. What you have would appear to be a hack, which may very well break some browsers.

grahamstewart

WebmasterWorld Senior Member 10+ Year Member



 
Msg#: 3397 posted 2:35 pm on Apr 11, 2004 (gmt 0)

It is a syntax hack designed to send the 'incorrect' width of 780px to IE5.* browsers and the correct width of 760px to all other browsers.

IE5.* has a broken box model which means it incorrectly includes padding when it calculates width. Here the padding is 10px on either side so 20px must be added to the width.

I personally dislike and distrust syntax hacks and I prefer to send IE5 an additional 'fixes' stylesheet by using IE conditional comments:


<!--[if IE 5]>
<link rel="stylesheet" type="text/css" media="all" href="/styles/ie5fix.css">
<![endif]-->

aeve

10+ Year Member



 
Msg#: 3397 posted 2:57 pm on Apr 11, 2004 (gmt 0)

It's another box model hack, google the 'simplified box model hack':

<style type="text/css" media="screen, projection">
/* media screen, projection hides everything from nn4 */
#container {
width: 760px; /* for opera 5 and escape chokers */
\width: 780px; /* ignored by all but ie5+6 (should be 782px to account for the border as well as the padding) */
w\idth: 760px; / * value for compliant browsers and ie6, ignored by ie5's */
border: 1px solid gray; /* ie5 and ie6 quirks read this as inside the width */
margin: 10px;
margin-left: auto;
margin-right: auto;
padding: 10px;/* ie5 and ie6 quirks read this as inside the width */
}</style>

I haven't ever used this particular hack. It's better to just get into the habit of not declaring a width on an element that has borders or padding.

Adam
<edit>sorry for redundancy, too slow</edit>

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / CSS
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved