css-hack

using #IEroot for ie-targeted styling?

Has anyone been able to succesfully use the IE CSS hack #IEroot? I stumbled upon it from this article but it doesn't seem to work for me. I'm trying to fix/hack the inline styling bug to produce li inline blocks #featured li { margin:0px; padding:0px; width:317px; height:310px; display:inline-block; border-left:1px #bdbdbd solid;...

What is better: CSS hacks or browser detection?

Commonly when I look around the Internet, I find that people are generally using CSS hacks to make their website look the same in all browsers. Personally, I have found this to be quite time consuming to find all of these hacks and test them; each change you make you have to test in 4+ browsers to make sure it didn't break anything else....

Acceptable CSS hacks/fixes

Is there a list of 'good' clean CSS hacks, which are certain to be future-proof? For example, zoom:1 is safe, as long as it's only served to IE, and you remember it's there. The very common hack of using child selectors is not safe because IE7 supports them. Using height:1% just feels dirty (but that might just be me). I know of ie7-...

CSS method to include IE6 hacks

CSS has @import, right? IE6 understands *html selector hack, right? Is it possible to combine them like //*html @import url(ie6hacks.css); or, possibly, //*html { @import url(ie6hacks.css); } ? Good browsers must skip this, will it still work in IE6? How does it look as a solution? I can clearly see it looks ugly as normal CSS....

Positioning Bug <IE8 - Why? Best workaround?

I noticed that a site I'm maintaining had a little layout bug in FF/IE8/Chrome (on this page for example) - the image in the top left hand was a little high, straying into the header at the top. I wondered why I hadn't notice it when I took over the site, but I realise it has only since I upgraded IE7 to IE8 that it had become apparent ...

Rendering a hierarchy of "OPTION"s in a "SELECT" tag

My problem is HTML and CSS related. I have a hierarchy type structure that I want to display inside a list. The hierarchy contains Countries, States and Cities (it is three levels deep). I want to display the list inside a select list, each item type (Country, State, City) must be selectable. The items should appear indented as: Unite...

Why css hacks not patched by agent developers?

Second line of the following is not recognisable by IE6/Windows #header {margin-bottom:3em} html>body #header {margin-bottom:1em} I can understand that child selector is a feature not implemented by IE6. But IE/Mac will not recognize following. /* Hide from IE-Mac \*/ #header {margin-bottom:3em} #footer {margin-top:1.5em} /* End hid...

Which css hacks for IE 6 and 7 are future proof?

Which css hacks for IE 6 and 7 are future proof? i mean if i use then then they would never create any problem and their patch will never be implemented? manage 2 css one for all and one for IE is time consuming and it adds one extra style sheet also. and if any hack can solve problem within main css then it's a timesaver and when multi...

Future proof CSS hack for LTE Opera 10

I’m currently using @media screen and (-webkit-min-device-pixel-ratio:0) { example {} html:first-child example {} } to target Safari + Opera 9.2 Is there a safe way to target opera gte op 9.5 or lte op 10? (for example it won't be picked up by an upcoming version of firefox) By the way, type="text/opera" isn't working any...

IE 6 png transparency issue...

My page is not rendering properly in ie6 because of transparency problem in ie 6. How can fix this issue. ...

css - set max-width for select

I have a form with a drop down list of venues and a submit button. They are supposed to be on the same line, but since the list of venues is dynamic, it could become too long and push the button down. I was thinking of setting a max-width property to the select, but I'm not clear whether this will work in all browsers. Do you have any s...

What is this CSS rule?

In the son of suckerfish drop down menu: http://www.htmldog.com/articles/suckerfish/dropdowns/example/ You see this rule w\idth: 13.9em; This can't be a typo as it appears various times in the css. What is it for? ...

noscript tag appears even if javascript is turned on in IE8

ghost noscript tag more info here I am facing exactly this issue, how shall I handle this for Internet Explorer browsers :-( ? Explanation: I have included the following noscript tag in my application's layout <noscript style="background:#ffcc00;font-size:200%;font-family:verdana;text-align:center;text-transform:uppercase;font-weight:b...

What does this CSS do?

input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;} input,textarea,select{*font-size:100%;} This is from the YUI reset css. What does the * before font-size:100% do? ...

CSS renders Input in firefox mac diffrent then firefox PC. can i detect OS via javascript? or maybe a CSS hack?

I have a input[type="text"] the that has padding applied to it behaves differently in firefox PC then on a mac. Any hacks that can target firefox PC? These styles are what its seen on firefox PC firebug .searchContainer input { border-color:#7C7C7C #C3C3C3 #DDDDDD; border-style:solid; border-width:1px; color:#555555; fl...

problem with the table width in IE?

I am using table to display a set of data, my HTML code goes here... <table border="1" cellspacing="0" cellpadding="0" style="width: 780px;"> <tbody> <tr> <td style="width: 780px; height: 25px;"> <pre width='100' style='width: 780px; word-wrap: break-word;'> the data goes here..... </pre> ...

IE7 - absolute positioning offset different to Firefox?

Hi, I'm tidying up another developer's work who seems to have done a shoddy job with the CSS. There is the main "wrapper" div on the page, and inside this is a logo and images for the navigation. The images are using "position: absolute" and using the CSS "top" property to offset them. However, Firefox and IE seem to start their offset...

CSS for Disabled Textbox (Prevent "graying out" in Firefox/Chrome)

Is it possible to set CSS for disabled textboxes? I don't want the automatic gray-out in Firefox/Chrome. The reason is that I'm sometimes disabling textboxes right before submitting a form so they don't get unnecessarily transmitted (and clutter the URL), and that gray-out behavior is degrading the user experience by creating flicker. ...

Best book that talks about css hacks and building cross browser compatible css techniques

Here are some books that talks about CSS Hacks. Of these can you suggest the best one. http://www.flipkart.com/css-hacks-filters-joseph-lowery-book-0764579851 http://www.flipkart.com/css-anthology-rachel-andrew-101-book-0957921888 http://www.flipkart.com/css-anthology-rachel-andrew-101-book-0980576806 http://www.flipkart.com/css-davi...

Is there any ie9 css-hacks? Already needed.

Is there any ie9 css hacks? I tryed to find them. But i didnt find any. ...