Re: [css-d] Noscript tags and degradation
> From: css-d-boun...@lists.css-discuss.org [mailto:css-d- > boun...@lists.css-discuss.org] On Behalf Of Jess Jacobs > Sent: Friday, February 12, 2010 1:02 PM > To: css-d@lists.css-discuss.org > Subject: [css-d] Noscript tags and degradation > > Hey everyone, > > I'd like to start a discussion around js-degradation options, and I'm > wondering what people's approaches are. I've tried several over the > years, > and it's constantly evolving. > > A thought occurred to me recently: > > > > .nojs #content-packs { display: block; } > > > > could be placed within the document's head (or body, depending on the > need) > to provide some extra help to the nojs version. (nojs class is > typically > placed on the body, in this case.) > > 1. Does anyone see anything fundamentally wrong with this approach? (We > could make this an include, as well, for good form, but I'm trying to > stick > to simple nuts and bolts here.) > > 2. Can someone suggest an approach they might think is superior? > > The issue at hand is that a page is hiding/showing content divs based > on > click events, which clearly can't happen if the user's js is disabled. > Business logic states that all content must be made visible on the page > for > a non-js user experience, and there can be no flash of the non-js > arrangement while the js-enabled version is loading. That's a mouthful. fwiw, I do not use (I consider this bad practice). I use *JS* to plug an ID on HTML and use that ID to style elements that need to be styled only when JS is available. For example: #JS .myCoolBox {display:none;} -- Regards, Thierry www.tjkdesign.com | www.ez-css.org __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Noscript tags and degradation
I agree with Mark. Plus, I've also heard it said that there may be instances where JavaScript is blocked from a page (in a business environment perhaps). Not disabled mind you - but blocked. Therefore the noscript tag would not fire and your user would still be left with nothing to see. Michael "Spell" Spellacy -Original Message- From: css-d-boun...@lists.css-discuss.org [mailto:css-d-boun...@lists.css-discuss.org] On Behalf Of Mark Wonsil Sent: Friday, February 12, 2010 4:40 PM To: Jess Jacobs Cc: css-d@lists.css-discuss.org Subject: Re: [css-d] Noscript tags and degradation > 1. Does anyone see anything fundamentally wrong with this approach? (We > could make this an include, as well, for good form, but I'm trying to stick > to simple nuts and bolts here.) > > 2. Can someone suggest an approach they might think is superior? I like the idea of using progressive enhancement instead of graceful degradation. It's goal is the same but you start simple and add functionality for those who can use it. It approaches the issue from the opposite direction. http://en.wikipedia.org/wiki/Progressive_enhancement This is one of the ways to add JS as needed: http://en.wikipedia.org/wiki/Unobtrusive_JavaScript Mark W. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] Noscript tags and degradation
> 1. Does anyone see anything fundamentally wrong with this approach? (We > could make this an include, as well, for good form, but I'm trying to stick > to simple nuts and bolts here.) > > 2. Can someone suggest an approach they might think is superior? I like the idea of using progressive enhancement instead of graceful degradation. It's goal is the same but you start simple and add functionality for those who can use it. It approaches the issue from the opposite direction. http://en.wikipedia.org/wiki/Progressive_enhancement This is one of the ways to add JS as needed: http://en.wikipedia.org/wiki/Unobtrusive_JavaScript Mark W. __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
[css-d] Noscript tags and degradation
Hey everyone, I'd like to start a discussion around js-degradation options, and I'm wondering what people's approaches are. I've tried several over the years, and it's constantly evolving. A thought occurred to me recently: .nojs #content-packs { display: block; } could be placed within the document's head (or body, depending on the need) to provide some extra help to the nojs version. (nojs class is typically placed on the body, in this case.) 1. Does anyone see anything fundamentally wrong with this approach? (We could make this an include, as well, for good form, but I'm trying to stick to simple nuts and bolts here.) 2. Can someone suggest an approach they might think is superior? The issue at hand is that a page is hiding/showing content divs based on click events, which clearly can't happen if the user's js is disabled. Business logic states that all content must be made visible on the page for a non-js user experience, and there can be no flash of the non-js arrangement while the js-enabled version is loading. That's a mouthful. Jess Jacobs aki...@gmail.com http://www.akisma.com __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] divs dropping
e...@copywritecolombia.com wrote: >>> Hi all, >>> I am having troubles with the divs in this page, >>> http://www.copywritecolombia.com/index3.html >>> the center content is dropping below the leftnavigation. They should be >>> in this order (from --left to right-- of the page): >>> >>> >>> >> > > > Thank you Tim and David for the advice. Due to design requirements we have > a 500px width image in the maincontent div. So I am thinking that the > soultion is to make the width of the main div (wrapper) 810px and then > 155px and 155px. Hopw does that sound? Thank you > > > That should not be a problem providing you make the overall width just a bit wider than 810px to allow just a little "play-room" for IE/6 to adjust; and, recognize that users at 800 will draw a slight horizontal scrollbar if the overall width of the page is greater than around 780px. Either way, handled with care, the code provided should do the trick. Best, ~d -- desktop http://chelseacreekstudio.com/ mobile http://chelseacreekstudio.mobi/ __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
Re: [css-d] divs dropping
>> Hi all, >> I am having troubles with the divs in this page, >> http://www.copywritecolombia.com/index3.html >> the center content is dropping below the leftnavigation. They should be >> in this order (from --left to right-- of the page): >> >> > > > Cursory checked in IE 6/7/8, Opera, Chrome, SeaMonkey, Camino, and FF. > Amend declarations as below: > > > BODY { > /*PADDING-RIGHT: 0px;*/ > /*PADDING-LEFT: 0px;*/ > FONT-SIZE: 80%; > BACKGROUND:#E6F6FB url(bg00.htm) repeat-x scroll left top; > /*PADDING-BOTTOM: 0px;*/ > MARGIN: /*0px 0px 20px*/ 0; > padding:0; > COLOR: #003300; > /*PADDING-TOP: 0px;*/ > FONT-FAMILY: Arial, Helvetica, sans-serif; > HEIGHT: 100%; > TEXT-ALIGN: center; > } > #bonusinfo { > border: 1px dashed red; > /*float:left;*/ > float: right; > /*width:93px;*/ > width:215px; > /*padding-top:0px;*/ > padding-left:6px;*/ > background: url('left.jpg') no-repeat; / > *height: 409px;*/} > > #maincontent { > border: 1px dashed red; > width: /*500px*/439px; > float:left; > overflow: hidden;} > > #leftnav {float: left; > width: /*159px*/150px; > border: 1px solid /*#f4f4f4*/red ; } > > > Best, > ~d > Thank you Tim and David for the advice. Due to design requirements we have a 500px width image in the maincontent div. So I am thinking that the soultion is to make the width of the main div (wrapper) 810px and then 155px and 155px. Hopw does that sound? Thank you __ css-discuss [cs...@lists.css-discuss.org] http://www.css-discuss.org/mailman/listinfo/css-d List wiki/FAQ -- http://css-discuss.incutio.com/ List policies -- http://css-discuss.org/policies.html Supported by evolt.org -- http://www.evolt.org/help_support_evolt/