If you had to choose a browser (just one) to be the primarily supported browser for a company jumping into HTML5 (CSS3).. Which one would be your safest bet on the middle-long term? Chrome, FireFox, Safari, IE? I'm looking for an objective recommendation based on standards driven/compliant, developer tools, fast & correct feature impl...
Hi, I'm trying to use the Delicious font via CSS 3's @font-face property, but unfortunately the rendered text looks pretty indifferent across browsers. Are there some tricks or general guidelines to make it look the same? Also, it seems that there's no AA in TTF's, but with OFT there is. Why? ...
Dear StackOverflow users, I'm having a problem with CSS. The style it's correctly applied in all browsers (IE6/7/8, Firefox 3+, Opera 9.5+, Google Chrome 3/4) but in Safari 4.0 it is not. If I use: @media screen and (-webkit-min-device-pixel-ratio:0) { #blaat { margin: 1px 0px; } } I can make work in Safari, but then it breaks in ...
I am trying to make text inside a transparent div have no opacity, aka be completely black: <div style="opacity:0.6;background:#3cc;"> <p style="background:#000;opacity:1">This text should be all black</p> </div> Is this possible to do with only CSS? Thanks in advance ...
I am web-developer. I would like to integrate 3D Content into my web-site. The level of integration should allow something like 3D Cube floating above HTML Content. Moreover, I want 3D Content to be interactive, i.e. one should be able to click on certain side of the cube and get some JavaScript code executed in same way as if somebody c...
Hi, the most thing i hate in the new CSS3 is that there is always 2 tags you should put to do one effect, I think this is not pro, and increase the css size, by example, why they don't unit -webkit-border-radius and -moz-border-radius in border-radius Imagine if we have 10 browsers, will we write 10 lines to do a rounded corner effect...
See http://cssfingerprint.com/about#stats. See also http://stackoverflow.com/questions/933645/multi-column-css-lists. I want a multi-column list that: uses no JS reflows on window size makes as many columns as fit the enclosing element therefore, does not require batching the list into manual column groups works in all browsers w...
How do I get an inset CSS3 box shadow to render on top of its children elements? Problem: HTML: <div id="chatroom"> <div class="chatmessage"><b>User 1:</b>Test</div> <div class="chatmessage"><b>User 2:</b>Test</div> <div class="chatmessage"><b>User 1:</b>Test</div> <div class="chatmessage"><b>User 2:</b>Test</div> ...
If you don't know what I mean, check this image out: Multiple images I want to know how it works, CSS yes, but exactly how does it all work out when using a background using this image and then it is all cut all exactly what it is supposed to do - when determined as a background for this image. Would be interesting for me to know how ...
Which browsers have support for CSS :before { content: "x"; }? I could not find any information about this question. It seems that the CSS attribute content is quite unknown in the community although seemingly useful. ...
I'm looking at the MDC page for the @font-face CSS rule, but I don't get one thing. I have separate files for bold, italic and bold + italic, how can I embed all three files in one @font-face rule? For example, if I have: @font-face { font-family: "DejaVu Sans"; src: url("./fonts/DejaVuSans.ttf") format("ttf"); } strong { fo...
Hi, I have an image of 4x4 in size and I want to use it all around a DIV's border. The following: -moz-border-image: url("../images/window/side.png") 4 4 4 4 / 4px 4px 4px 4px repeat repeat will place left and right borders, but not bottom and top. What's wrong with it? I think I have misunderstood the syntax and if that is so, how d...
I've been playing with the -webkit-box-reflect property in Chrome and can achieve a reflection that fades with the following code (it's example code from the Webkit blog): -webkit-box-reflect: below 5px -webkit-gradient( linear, left top, left bottom, from(transparent), color-stop(0.5, transparent), to(white) ); Problem is...
Hi - I'm trying to place a nice border around an image that's 250x250, using only html and css. The markup is this: <div id="img-container"><img src="pic.jpg" border="0"/></div> And the css is: #img-container { height: 225px; width: 225px; padding: 3px; border: 1px solid black; z-index: 10; position: relative;...
Hello I would like to use css3 to present a two column layout. The markup i am using is this <div style="-webkit-column-count: 2; -webkit-column-rule: 1px solid black; -webkit-column-width: 80px; margin-left:20px;margin-top:20px;" > <div id="picturebox" style="">picture box</div> ...
Perhaps this question has been asked elsewhere, but I'm unable to find it. With HTML5 and CSS3 modules inching closer, I'm getting interested in a discussion about the way we write CSS. Something like this where selection is done via element order and pseudo-classes is particularly fascinating. The big advantage to this method seems to...
I'm doing some tests with new features of CSS3, but this combination only works in lastest versions of Chrome and Firefox, but not in Safari or Opera: box-shadow: inset 0px -10px 20px 0px rgba(0, 0, 0, 0.5); -webkit-box-shadow: inset 0px -10px 20px 0px rgba(0, 0, 0, 0.5); -moz-box-shadow: inset 0px -10px 20px 0px rgba(0, 0, 0...
I want to use CSS3 gradients for my color and then apply a background-image to apply some sort of light transparent texture. Is this possible? ...
Hi, Could someone explain to me what this portion of code means? repeat scroll 0 0 #F6F6F6; I have googled a lot and only found syntax to this part -moz-linear-gradient(center top , #FFFFFF, #EFEFEF) My code: background: -moz-linear-gradient(center top , #FFFFFF, #EFEFEF) repeat scroll 0 0 #F6F6F6; Thanks! ...
I use some CSS styling to hide input buttton, images and so on but i wonder how can i remove or better: modify, where / what shows up on printed page in place of title and page address? ...