Re: [css-d] Cascade related question
On 9/3/09 7:36 AM, Climis, Tim tcli...@indiana.edu wrote: The spec. Section 6.4.3 Calculating a selector's specificity http://www.w3.org/TR/CSS21/cascade.html#specificity There are basically three tallies when figuring out specificity. There's basic tags (a). There's tags with classes (a.nav). and there's tags with id's (a#home). Something with a class is more specific than something without one, so it wins. Something with an id is more specific than something with a class, so it wins. Also, something with two selectors is more specific than something with one selector (div.footer a is more specific than a). If two selectors have the same specificity, the one later in the file wins. This presentation: http://www.slideshare.net/maxdesign/css-cascade-1658158 was really helpful for me to understand specificity. Regards, Divya -- I blog at http://nimbupani.com/blog __ 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] Fix for chrome browser
On Wed, Aug 12, 2009 at 7:07 AM, bharani kumarbharanikumariyer...@gmail.com wrote: Hi All, This is general question , For IE , if we want to write an fix means , then we use something like _height:200px; For chrome , how to write an fix , Can some one tell with few example , Also for FF , IE-8 , http://www.catswhocode.com/blog/15-techniques-and-tools-for-cross-browser-css-coding __ 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] Safari Issue with using Absolute Positioning span inside of Overflow:auto (Scrolling Division)
Hi Susan On Fri, Aug 7, 2009 at 7:41 AM, Susan Grossmansusan.rgross...@gmail.com wrote: I have a *Safari only * Issue with using Absolute Positioning tool tips inside of Overflow:auto (Scrolling Division) If you scroll to the bottom table row, and mouseOver the icon, the tool tip shows as if the table wasn't contained in a scrolling division. It shows where the table row would be - underneath the division. Seems like it must be how different browsers deal with position:absolute which does not have the top, left defined. You might try defining top, left for the span after specifying position:relative on the containing a (a.tooltipExpire) - divya http://nimbupani.com/blog __ 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] site check in IE + background image issue
On Mon, Jul 6, 2009 at 10:12 AM, Ron Zismanronzis...@mac.com wrote: i'm also having issues with a background image (a slight gradation on the red background) You should try to use much higher resolution for the background image if you want to see a more smooth gradation in the background. What you see in photoshop is definitely not what you get! I have had such an issue before, but I cant achieve perfect smoothness in gradient, except for small gradients. - divya http://nimbupani.com/blog/ __ 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] elements disappearing in IE6, bad Safari rendering
On Fri, Jul 10, 2009 at 11:12 AM, Lori K. Brownlori...@brownphotos.com wrote: Dear list: I have been working on a revised site template, here: http://ibis.grdl.noaa.gov/SAT/draft/index.php Then I heard that it breaks on Safari for the Mac, and that the lower right banner elements disappear completely in IE 6. Can anyone clue me in about what these two browsers, which I don't have direct access to, are unhappy with? Lori, I have looked at it in Safari, and the only breakdown I see is Star Home/Intranet/Sitemap are below the line separating the header from the content. I suggest you remove some unnecessary floats, for e.g. ( div#LSA_right form has an unnecessary float) div#searchBox2 has an unnecessary display:inline !important. I think you should try to minimize the use of !important. AFAIK, IE 6 does not recognize properly !important - IE 6 applies any rule that is defined last as more important than any rule with !important). Sorry, if I can't be of much help. Regards, Divya __ 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] IE7 bugs
On 6/22/09 11:50 AM, Joseph Sims metronom...@yahoo.com wrote: I have a site in the works... http://www.titancom.net/dev/hec/JS/index.html And the left sidebar carries white all the way down the page... obscuring the background that is supposed to create the faux columns look - example: http://www.titancom.net/dev/hec/JS/about.html. The left sidebar has height defined as 100%. Probably why you see the background all the way to the bottom. - divya -- I blog at http://nimbupani.com/blog __ 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] Can view in Safari but not Firefox
On Mon, Jun 22, 2009 at 8:15 AM, Ellen Heitmanellen.heit...@gmail.com wrote: #timelinebkgd { background: url(images/timeline_bkgd.jpg); width: 689px; height:653px; position:absolute; top:24px; left:12px; z-index:5; margin:0 auto; text-align:center; } Any ideas as to what the problem could be? Thanks! The only thing I see is margin:0 auto; is redundant when you are using position:absolute (positioning takes precedence). Other than that we do really need a URL to figure it out. Probably some other parent element is causing the issue? - divya __ 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] Height 100%
Hi Trevor On 6/20/09 11:18 PM, trevor bayliss bayliss_tre...@yahoo.com wrote: Hi all, I changed the height of the div #insidecentre to 100% instead of 535px as the fixed pixel height was making the text in the div overlap the footer. 100% works fine to sort out that problem but now the div is only as high as the text inside the div and when there is little text this means the div is too small (I would like it to be 535px). http://tinyurl.com/lch7u3 What is another css solution to this problem? Thank-you in advance You can set the min-height of the div to be 535px this means it will be minimum 535px and expand if the div has more text. For IE 6, you would have to set the div to be 535px as it does not understand min-height Regards, Divya -- I blog at http://nimbupani.com/blog __ 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] How to make rounded corners box with one image?
On 5/2/09 9:51 AM, Dan King dan.king...@yahoo.com wrote: I found an example online: http://modxcms.com/about/blog/rthrash/simple-rounded-corner-css-boxes.html that seemingly matches what I'm looking for. The concept is clear, but I need some help in figuring out how to determine margins/padding for the respective image used. If you or anyone else has used or understands the method demonstrated in the link provided, could you help clarify how to determine the needed margins/padding? Thanks. The technique in the article seems to have a lot of limitations (at least the dropped shadow part). Seems like your box cant be longer than the image used, or wider than that single image. If you have fixed width, it is easy to do rounded corners with one image. But if the box is flexible, you can try using jquery options: http://15daysofjquery.com/wrap-it-up-pretty-corners/13/ - divya -- I blog at http://nimbupani.com/blog __ 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] IE 8
On 5/5/09 4:28 PM, Kathy Wheeler kat...@home.albury.net.au wrote: Ummm ... scratches head ... what do you mean by does not support ? IE6 standalone on my test win box loads pngs fine ( well ... as fine as ie6 is supposed to anyway - no png transparency :-( ). I use them (pngs) as background images for css elements, inline as normal images ... and ie6 displays them all. Do you perhaps mean the various png transparency hacks??? I'm still having trouble finding one of those that works for png transparency with CSS background images. Here is the BEST solution to IE png transparency: http://www.dillerdesign.com/experiment/DD_belatedPNG/ It does background-position on transparent pngs and is faster than the usual png hacks. I have also experienced MultipleIEs have issues with javascript (sometimes CSS). Plus it doesn't work as expected when u install IE 8. I am still looking for a good solution to test IE 6/7/8 in one machine, no luck so far. - divya -- I blog at http://nimbupani.com/blog __ 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] IE6/IE7 border problem on list items (wrapping)
On Wed, Apr 15, 2009 at 11:43 AM, Stephen Tang clowwizarder...@gmail.com wrote: Hi Brian, Actually, the li tags are display: inline. However, there was a float: none that was taking precedence over the float: left in another class. When I remove it, I can see what IE6/IE7 is doing. The li box is actually two lines. http://www.stephentang.info/ie/test2.html Hmm, I may have to try applying borders on the anchor tag instead. --Stephen I had the same issue before, the only way I resolved it was to use the pipe character in the HTML. :( Apparently applying borders to inline elements is messy and should be avoided. - divya http://nimbupani.com/blog __ 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] double borders. A different story in IE?
On 4/9/09 1:37 PM, Michael Adams linux_m...@paradise.net.nz wrote: Divya - I disagree. IE7 handles the XML declaration fine in standards mode[1]. Although i see it on line 8 when it should always be on line 1. IMHO IE less than IE7 should always be in quirks mode and the XML declaration will achieve this. Jon - I am on linux here at home so no IE running. Will look at it at work later today but you may already have an answer by then. [1] http://blogs.msdn.com/ie/archive/2005/09/15/467901.aspx I think this bug is still triggered in IE 6[1], but I didn't realise the question was asked for IE 7. Sorry about that. [1] http://www.quirksmode.org/css/quirksmode.html __ 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] double borders. A different story in IE?
On 4/2/09 6:30 AM, Jon Wickström jon.wickst...@arrak.fi wrote: The look I'm after is a double border with the inner border the same color as the parent bg, and the outer the element bg. This I get in all sane browsers by specifying the parent bg as the border color and the border style double. This gives me a separated border with the element bg color. In the example I use red, not the parent backgroundborder color, to see the border clearly. The green border is just for your viewing pleasure. It is a div used for markup to center the menu. If anybody has a cleaner centering-solution, I'd bee happy to look at it. For a test-case see: http://www.ekebodagis.fi/ekebo/test.html IE is rendering your page in quirks mode because of the xml namespace declaration on top. Remove that and serve the page as content type text/html or use HTML 4 Strict if necessary. - divya __ 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] Wrap text in li
It would be great if you have a url and then present what is the current behavior (which browser/os) and what is the expected behavior. On Thu, Apr 9, 2009 at 8:04 AM, Chike Loney chikelo...@gmail.com wrote: Lol sry I ddint use a parent ul but even though the text in the li is not wrapping, meaning I want it to display within a certain area so if ther is more than one line of text it wud automatically skip to a next line and align itself... Sent from my BlackBerry® wireless device available from bmobile. -Original Message- From: Bobby Jack bobbykj...@yahoo.co.uk Date: Thu, 9 Apr 2009 18:59:59 To: CSS-Dcss-d@lists.css-discuss.org Subject: Re: [css-d] Wrap text in li --- On Thu, 4/9/09, Chike Loney chikelo...@gmail.com wrote: Hi guys, can anuyone tell me how to wrap text in a list item please? Sure: litext/li :-) Of course, you're /probably/ not asking for that, but it would be useful to have a BIT more detail. Do you mean 'dynamically'? If so, you want to be looking at javascript for that, not CSS. Do you mean 'wrap' as in what happens when text won't fit within the width of one line? That should happen automatically, but you can reduce the width of the parent ul/ol with the CSS width property. I can't think what else you might mean. - Bobby __ 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/ __ 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] Rounded corners with fixed height problem
Hi Anne On 3/25/09 9:14 PM, Anne E . Shroeder a...@language-works.com wrote: I've got a bit of a challenge with rounded corners - have a fixed height (it's all going into an iframe) and cannot seem to get the borders out to the edge and the rounded corners placed - an additional problem is that the comp calls for only half of a top border and a small dotted border above that - I'm just not sure that can be done? The graphics for the rounded corners aren't very good - they are just place holders. The problem is in the right hand column that starts with Benefits. What you are attempting to do is very challenging with fluid layouts. I suggest you keep the last column width in pixels and use a background image (with the dotted lines and rounded corners for top and just the rounded corner on the bottom) to get the effect you are looking for. - divya __ 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] Positioning images and wrapping text...
On 3/30/09 4:20 PM, Bobby Jack bobbykj...@yahoo.co.uk wrote: --- On Mon, 3/30/09, Michael Beaudoin mich...@ba-doyn.com wrote: Is there a way to precisely position an image and have the wrap follow? You can float the image and assign precise margins as Gunlaug has done to get what you need. I think the best would be to attempt it and post here with what works/doesn't work. - divya __ 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] removing input background color
2009/4/1 Chris Kavinsky ckavin...@gmail.com: I'm replacing the button for a search form with a background image. The image is a transparent png file, and even though the background-color is set to none, a light grey color is showing up. Are you looking at it in IE 6? I dont see any grey color in Opera 9.6 - divya __ 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] removing input background color
On Wed, Apr 1, 2009 at 9:37 AM, divya manian divya.man...@gmail.com wrote: 2009/4/1 Chris Kavinsky ckavin...@gmail.com: I'm replacing the button for a search form with a background image. The image is a transparent png file, and even though the background-color is set to none, a light grey color is showing up. The default state for background-color is transparent and not none. - divya __ 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] Footer at the bottom of the page issue
On 3/26/09 1:21 PM, Frederyco Martins fredy.mart...@gmail.com wrote: Hi folks, How do I keep a footer always on the bottom of the page, without using absolute positions, with css??? Could you help me, please? I am using wordpress as a CMS and the website is not online yet. But the code is quite simple. I have a div indetified as footer, at the bottom of the code. You can try using this: http://ryanfait.com/sticky-footer/ __ 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] Flash header problem in IE
On 3/26/09 3:00 PM, Anne McKinsey anne...@charter.net wrote: Greetings, I have a Flash animation header on a home page and there is about 2px of space below the header when viewed in IE. The other pages have regular image headers and I have used the following css which closes up the 2px of space: #header img {display: block} #header {display: block} Does anyone out there know what selector I can use that will close up the space for the Flash header? I would try to remove the space (and the HTML comment) between /embed and /div not sure if that will help. __ 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] Faux Column and equal heights with image
2009/3/30 Nancy Johnson njohnso...@gmail.com: Hi, I've emailed this list before regarding issues I am having with equal heights and am trying a simple faux column with a background image. My question is, in IE6, IE7 Firefox 2 and I think safari, the image width doesn't increase when the user changes the text-size within the browser. Is there any fix for this, would creating a .png file help? I don't think there is any solution for em-based layout but there is one for % based fluid layout [1] - divya http://nimbupani.com [1] http://www.communitymx.com/content/article.cfm?cid=afc58 __ 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] IE and png transparency
On Fri, Mar 27, 2009 at 7:22 AM, Nick Fitzsimons n...@nickfitz.co.uk wrote: If you need to support PNG transparency in IE6, you want the AlphaImageLoader filter [1] [2] [3]. [1] http://msdn.microsoft.com/en-us/library/ms532969.aspx [2] http://support.microsoft.com/kb/294714 [3] http://www.satzansatz.de/cssd/tmp/alphatransparency.html In my opinion, this [1] is the best PNG Fix I found. [1] http://www.dillerdesign.com/experiment/DD_belatedPNG/ - divya http://nimbupani.com/blog __ 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] Image stretches vertically in (that's right) IE6
On Fri, Mar 27, 2009 at 11:55 AM, Ian Piper ianpi...@mac.com wrote: The offending photos are styled pictureright and pictureleft. On Safari, Firefox and IE7 these pictures appear to be fine, but in IE6 the photos are stretched vertically. I can't figure what is happening - can anyone either confirm that they also see this effect or suggest what may be wrong? I see the effect in IE 6. Probably the best choice would be to apply the float on the parent div of the image rather than on the image itself. Plus would also help to remove position:relative as it seems to be doing nothing in the styling. - divya __ 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] Up Margin - where is it?
On 3/18/09 9:45 PM, Pablo Augusto em...@pabloaugusto.com wrote: Hello, I`m transforming this site: http://www.caarj.org.br/ to wordpress. Its all 95% done, now im fixing details. Theres a up space (white above logo) i just look everywere to remove it, margin, padding, etc, but have no sucess, can anyone gime a help? __ here: #Header h1 { background-attachment: scroll; background-repeat: no-repeat; background-position: 50% 0; background-color: transparent; background-image: url(http://www.caarj.org.br/wp-content/themes/CAARJ-0.1/img/logo.png;); height: 92px; text-indent: -999em; width: 800px; } The background position of the image in h1 is specified at 50% 4px remove the 4px and it will not show the space above the logo. __ 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] Transparency in pre IE7
On 2/4/09 2:32 PM, Tim Arnold tim.arn...@gmail.com wrote: Kenoli, You will have to use a 24-bit PNG graphic which will work perfectly in IE7+ and Firefox. To get IE6 and lower to correctly render the transparent PNG graphics you are going to have to use some javascript. I don't think there is anyway around that. Because I am already using jQuery for other things, I use: http://jquery.andreaseberhard.de/pngFix/ There is another one that works well and does not use jQuery: http://www.twinhelix.com/css/iepngfix/ I use this fix: http://www.dillerdesign.com/experiment/DD_belatedPNG/ which seems to also allow background positioning and is faster than some of the other fixes I have found. Regards, Divya __ 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/