Re: [css-d] stand-down
David Laakso wrote: Last call :-) : Still no luck. Quirksmode, this time. Simple layout. Unresolved problem in IE/6. Clicking digits will sometimes cause a completely blank screen. Anyone? html http://chelseacreekstudio.com/dl/index.php css http://chelseacreekstudio.com/dl/css/style.css David, I can still get a blank page. I did notice that if I go to the previous page (-) and then forward to the page (-) that was blank, it displays normal. This may have something to do with re-flow when the images starts to download. -- Alan http://css-class.com/ Armies Cannot Stop An Idea Whose Time Has Come. - Victor Hugo __ 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] Styling a definition list
On Jul 30, 2009, at 12:45 AM, Andy Stevens wrote: I have a page with an existing unordered list pIn these terms,/p ul listrong'content'/strong means the stuff you are looking at on this Site./li listrong'you'/strong, strong'your'/strong and strong'yours'/strong means you, the idiots accessing this Site./li listrong'we'/strong, strong'us'/strong and strong'our'/strong means Big Corporation Inc./li /ul (more or less) that I reckon, from a semantic viewpoint, ought really to be a definition list. So as a first step I swapped it for pIn these terms,/p dl dtstrong'content'/strong/dt ddmeans the stuff you are looking at on this Site./dd dtstrong'you'/strong, strong'your'/strong and strong'yours'/strong/dt ddmeans you, the idiots accessing this Site./dd dtstrong'we'/strong, strong'us'/strong and strong'our'/strong/dt ddmeans Big Corporation Inc./dd /dl However, I need to preserve the way it looked before, as the powers that be like it that way. In that case, I suspect you'll have to stay with an unordered list, unless you don't need to support IE 6 7. Any suggestions of the easiest/best way to make it appear as if it's still using ul li? I tried dt {display:list-item;} dd {display:inline;} but that still puts the definitions on the line below. I tried using dt {display:list-item; float:left; clear:left;}, but all the definitions run together one after the other instead of following their terms. dd {display:block;} works a bit better with that, but the definition lines still wrap to the edge of the term rather than looking like a continuous paragraph of text (and the vertical alignment is out between the two parts in each case). That would be the way to go, if the content of the dt's is more or less the same length, and there is enough space. If the content of the dt wraps, then things will look odd. And IE 6 and 7 will drop the list-marker due to 'hasLayout' on the dt. Another option is using generated content (to generate a list marker and a line-break) and display: inline. But that won't work in IE 6 7. IE 8, Safari 3+, Opera 9+, and Firefox 3+ should be OK with this. dt {display:inline; margin: 0 .2em 0 0; background:#ccc;} dd {display:inline; margin:0;} dt:before { content: '\25cf'; color: rgb(153, 153, 153); text-indent: 0; margin: 0 .1em -.2em -.95em; padding: .07em .18em 0 0; font-family: 'Lucida Grande', Symbol; } dd:after { content: '\A'; white-space: pre; } This test file has the 3 cases: http://dev.l-c-n.com/_temp/definition-list-genContent.html Philippe --- Philippe Wittenbergh http://l-c-n.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] Timing with css?
Tim Snadden wrote: On 29/07/2009, at 10:40 PM, Andzia wrote: Hello, I have this website almost finished: http://klikerlab.pl/ and I had an idea, that maybe I could make it more active, by changing the image to the left, each day. Can it be done with css? For example, that the chicken would be displayed on Monday, something else on Tuesday, etc or should I use a different method? You can't use CSS for this. You will need to do it with either a server side language (e.g. php) or with javascript. You can still use CSS to the extent that you could create classes called mon, tues, wed etc. and then use your server side language to set this class based on the current day. Or you could just have your CSS call one standard image name (todaysimage.jpg), while you have a script on your server run once a day, get the day of the week from the server's clock, copy tuesday.jpg to todaysimage.jpg, then just wait until the next day when it would copy wednesday.jpg to todaysimage.jpg. Wouldn't have to change anything in your CSS or HTML at all. -- David gn...@hawaii.rr.com authenticity, honesty, community __ 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] Site check imprimerie-salfati.fr
Hi : Thanks in advance for all those who can or will take a few moments to see how it works in yours browsers. I'm thinking too to redesign the whole site (well, its not a great site, only a few dynamic pages with a CMS system, SPIP) using Tripoli http://devkick.com/lab/tripoli/ Has someone experienced it ? Cordially Luis __ 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] creating for less than ie 8
Murgolo, James wrote: I have a site that looks fine everywhere but less than IE 8 (including IE 8 legacy mode). How do I get at that css so I can create a conditional mode for that? Thanks, James Murgolo Getting at it is easy enough. Knowing how to fix-it can be a little difficult, sometimes... See: http://reference.sitepoint.com/css/workaroundsfiltershacks http://www.satzansatz.de/cssd/onhavinglayout.html http://www.positioniseverything.net/ __ 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] Background images not appearing in IE7
Ellen Heitman wrote: Thanks, that is very encouraging to hear. I've thought about your email and have decided to try to eliminate the big background images without changing the look too much. Thanks again. Set your own pace. You'll do just fine. No question about it. Good-bye, Westmoreland Old soldiers never die they just fade away. --Douglas MacArthur __ 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] sticky footer up a little too high
My sticky footer is not sticking to the bottom of my browser window: http://www.redkitecreative.com/projects/getborn/ I'm using this method: http://www.cssstickyfooter.com/ Can anyone tell me what I'm doing incorrectly? -- Debbie Campbell www.redkitecreative.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] Timing with css?
On 29/07/2009, at 10:40 PM, Andzia wrote: Hello, I have this website almost finished: http://klikerlab.pl/ and I had an idea, that maybe I could make it more active, by changing the image to the left, each day. Can it be done with css? For example, that the chicken would be displayed on Monday, something else on Tuesday, etc or should I use a different method? Remotely (cough, cough) on-topic for css. I came in late to this discussion, but if you will review my website, namely -- http://sperling.com -- you'll see a tree logo on the left top corner. That tree changes with the seasons (i.e., Northern hemisphere) via a different css background rule. The background changes as the equinox changes. I do this with php and not javascript. That way I never have to worry about IF the user has javascript on or not. You see, php is always ON because it's server-side and not client-side. In addition, it is very easy to do time operations in php -- seek out a php list to ask questions about this. Cheers, tedd -- --- http://sperling.com http://ancientstones.com http://earthstones.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/
[css-d] phones using handheld media type
Does anyone have a link to a site that lists which phones typically make use of the style sheet specified for handhelds? I've been told that some of the newer phones were just using the screen styles but I'm not able to find anything to confirm that. Thanks, Jeremy __ 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] Remaining height design: IE shows an horizontal scrollbar :: ed
Alan Gresley wrote: Olivier Sannier wrote: [...] Thanks, this actually is the only thing of the two you proposed that has any effect. However, the first one got me thinking and I came up with this: *:first-child+html .innerContents { width: 98%; } .resizableArea { overflow-x: hidden; } This hides the horizontal scrollbar for all width of the window and makes the innercontents a bit smaller than 100% to account for the scroll bar hiding parts of it. Too bad there isn't any other way than using the non standard overflow-x property. Thanks for the pointers Cheers Olivier This is not an issue about a non standard overflow-x property but rather and issue about IE7 supporting an earlier version of CSS2.1 concerning overflow boxes and containing blocks. The scrollbar which you are removing is part of the html element. In the specs can be seen. Many thanks for your detailed explanation, it makes much more sense now. __ 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] phones using handheld media type
Jeremy Weiss ink wired: Does anyone have a link to a site that lists which phones typically make use of the style sheet specified for handhelds? Try the State of California's list: http://www.webtools.ca.gov/Web_Development/Designing_a_Website/Mobile_Devices.asp Hope that helps. -- I made magic once. Now, the sofa is gone. http://blog.dwacon.com http://www.twitter.com/dwacon __ 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] adding css to js, or the miserable 9 pixels
hey all, I hope you can help. I have a page which has a little javascript which rotates banner images. When I first added this js, the banner images slipped down 9px, showing a white gap on the top. After much trial and error, I added some css to the js in the header, and it looks hunky dory in everything but IE, which backs it up so that it covers 9px worth of the navigation and shows some weird junk at the bottom. http://www.uoguelph.ca/mcb/test/image-on-IE.png Is there someplace I can style the js so I can write an IE hack for it? Putting the css right in the js was all I could do that would work, but it doesn't work all that well, and I have a feeling that there must be a better way. Thanks in advance for your help, Sandy script type=text/javascript language=JavaScript !-- thank you to Bontrager Connection. Copyright 2002 Bontrager Connection, LLC // // Type the number of images you are rotating. NumberOfImagesToRotate = 5; // Specify the first and last part of the image tag. FirstPart = 'img src=images_banner/index'; LastPart = '.jpg height=220 width=860 style=margin-top : -9px '; function printImage() { var r = Math.ceil(Math.random() * NumberOfImagesToRotate); document.write(FirstPart + r + LastPart); } //-- /script http://www.uoguelph.ca/mcb/test/ http://www.uoguelph.ca/mcb/test/css/mcb2009.css http://www.uoguelph.ca/mcb/test/css/ie6-hacks.css http://www.uoguelph.ca/mcb/test/css/ie7-hacks.css __ 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] Fwd: adding css to js, or the miserable 9 pixels
-- Forwarded message -- From: Gabriele Romanato gabriele.roman...@gmail.com Date: 2009/7/30 Subject: Re: [css-d] adding css to js, or the miserable 9 pixels To: sa...@sandyfeldman.com The JS code provided is really ugly. Using write() is the worst approach, because the img is injected while the page is still loading and the DOM is not complete and ready to be used. Beside this, you should consider that an img is an inline element by default, so it's affected by line boxes height calculation. try to set in your css all the images in the banner to 'block'. and please, use a better approach in your js coding. HTH Gabriele ^.^/ -- http://www.css-zibaldone.com/ http://www.css-zibaldone.com/test/ (English) http://www.css-zibaldone.com/articles/ (English) http://dev.css-zibaldone.com/ (English) -- http://www.css-zibaldone.com/ http://www.css-zibaldone.com/test/ (English) http://www.css-zibaldone.com/articles/ (English) http://dev.css-zibaldone.com/ (English) __ 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] sticky footer up a little too high
On 31/07/2009, at 1:48 AM, Debbie Campbell wrote: My sticky footer is not sticking to the bottom of my browser window: http://www.redkitecreative.com/projects/getborn/ Firstly your IE stylesheet is being served to all browsers. That's not the cause of this problem but it will cause you problems down the line. It defeats the purpose of having and IE stylesheet. Hide it with conditional comments. In both ie7 (line 9) and in screen.css (line 126) there is the following #content { padding-bottom: 140px; } It needs to be 152px (equal to your 'top' value?) __ 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] adding css to js, or the miserable 9 pixels
Sandy Feldman wrote: hey all, I hope you can help. I have a page which has a little javascript which rotates banner images. When I first added this js, the banner images slipped down 9px, showing a white gap on the top. After much trial and error, I added some css to the js in the header, and it looks hunky dory in everything but IE, which backs it up so that it covers 9px worth of the navigation and shows some weird junk at the bottom. http://www.uoguelph.ca/mcb/test/image-on-IE.png Is there someplace I can style the js so I can write an IE hack for it? re: http://www.uoguelph.ca/mcb/test/ I guess you mean that the problem is in IE 6/7. An easy-out may be to use php to rotate the images? http://ma.tt/scripts/randomimage/ And Gabriele has already accounted for the gap. Incidentally your navigation is a little whacked in: Mozilla/5.0 (Macintosh; U; Intel Mac OS X 10.4; en-US; rv:1.9.1.1) Gecko/20090715 Firefox/3.5.1 hi David, hey Gabriele Thanks for your help. I am going to check out http://ma.tt/scripts/randomimage/ and see if it's foolproof enough for the likes of me will check out the navigation, too. I really appreciate you taking the time to look at this. Sandy __ 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] Styling a definition list
Andy Stevens wrote: I have a page with an existing unordered list I would keep it that way. (more or less) that I reckon, from a semantic viewpoint, ought really to be a definition list. I tend to agree, but what you really benefit from changing the markup, presentationally or otherwise? User agents that pay attention to dl semantics exist in our dreams only, for the most of it, partly because dl is mostly used for something that ain't never no def list. However, I need to preserve the way it looked before, as the powers that be like it that way. If you change ul to dl, there is no way to make it look the same again. Browsers may and do have their own ways of rendering these constructs, and these ways are largely undocumented and may change without any notice, before or after. Any suggestions of the easiest/best way to make it appear as if it's still using ul li? Well, this is thus an academic question, but I do love academia, don't I? :-) I tried dt {display:list-item;} dd {display:inline;} but that still puts the definitions on the line below. Well, there won't be any bullets then, as a rule, as there is no room for them. The following gives a somewhat reasonable approximation, I'd say: dt { display: list-item; margin-left: 2em; float: left; clear: both; padding-right: 0.3em; } -- Yucca, http://www.cs.tut.fi/~jkorpela/ __ 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] stand-down
Alan Gresley wrote: html http://chelseacreekstudio.com/dl/index.php css http://chelseacreekstudio.com/dl/css/style.css David, I can still get a blank page. I did notice that if I go to the previous page (-) and then forward to the page (-) that was blank, it displays normal. This may have something to do with re-flow when the images starts to download. Thank you, Alan. Same problem here. Simple stuff. Yet, it is as though IE/6 is unable to either find, or paint, a page called. Weird. __ 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] stand-down
On 7/29/2009 9:58 PM, David Laakso wrote: Alan Gresley wrote: I can still get a blank page. I did notice that if I go to the previous page (-) and then forward to the page (-) that was blank, it displays normal. This may have something to do with re-flow when the images starts to download. Thank you, Alan. Same problem here. Simple stuff. Yet, it is as though IE/6 is unable to either find, or paint, a page called. Weird. FWIW, I had the same problem with an IE6-specific stylesheet. In my case, the page blanked a millisecond *after* it was painted. I discovered it was an undocumented bug in IE8.js related to specifying overflow in the main div style. When I moved the overflow property up to the body, the problem went away. IE8.js includes many common IE hacks, so this same issue could crop up even if you're not using IE8.js, depending on what other hacks you may be using. __ 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] Styling a definition list
On 30/07/2009, at 3:45 AM, Andy Stevens wrote: Hi, I have a page with an existing unordered list (more or less) that I reckon, from a semantic viewpoint, ought really to be a definition list. So as a first step I swapped it for pIn these terms,/p dl dtstrong'content'/strong/dt ddmeans the stuff you are looking at on this Site./dd dtstrong'you'/strong, strong'your'/strong and strong'yours'/strong/dt ddmeans you, the idiots accessing this Site./dd dtstrong'we'/strong, strong'us'/strong and strong'our'/strong/dt ddmeans Big Corporation Inc./dd /dl However, I need to preserve the way it looked before, as the powers that be like it that way. Any suggestions of the easiest/best way to make it appear as if it's still using ul li? What about the following? dt,dd { display: block; float: left;} dt { clear: left; } dd { clear: none;} __ 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] stand-down
David Butler wrote: On 7/29/2009 9:58 PM, David Laakso wrote: Alan Gresley wrote: I can still get a blank page. I did notice that if I go to the previous page (-) and then forward to the page (-) that was blank, it displays normal. This may have something to do with re-flow when the images starts to download. Thank you, Alan. Same problem here. Simple stuff. Yet, it is as though IE/6 is unable to either find, or paint, a page called. Weird. FWIW, I had the same problem with an IE6-specific stylesheet. In my case, the page blanked a millisecond *after* it was painted. I discovered it was an undocumented bug in IE8.js related to specifying overflow in the main div style. When I moved the overflow property up to the body, the problem went away. IE8.js includes many common IE hacks, so this same issue could crop up even if you're not using IE8.js, depending on what other hacks you may be using. RE: http://chelseacreekstudio.com/dl/index.php Thank you for your reply. Interesting. Though, I regret it makes no difference, on this-end, whether the overflow property is used on the body, the parent, the child, or deleted entirely for IE/6-- still drawing a blank-page when clicking some digits-- and, not necessarily, the same digit each time. At one point, I thought, the extremely tall images, of different heights, might be the problem. Yet a version with all ten images at a width of 500px and a height of 630px drew blank pages, too... Best, Westmoreland __ 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/