I was wondering if there are any packages available out there to make CSS3 capabilities available to browsers that do not support it yet. The way I envision this, and I've been unable to find anything via search, is the JS would detect the browser and load its own library that essentially do the CSS3 functions using JavaScript. I kno...
Firefox 3.6 allows to set gradient on backgrounds. Is that possible to set gradient on the text color as well ? For example: HTML: <span>Hello</span> CSS: body { background: -moz-linear-gradient(left, red, white); } span { font-size: 13em; color: #222; } I would like to "replace" #222 with -moz-linear-gradient(left, ...
I would like to style <input type="file" /> using CSS3. Alternatively, I would like user to press on a div (that I will style) and this will open the Browse window. Is that possible to do that using HTML, CSS3, and Javascript / jQuery only ? ...
I'm using Firefox 3.6.6. I styled my "input file" that looks like this: Here is the code: (live example here) HTML: <div id="wrapper"> <div id="customButton"> <img src="http://i28.tinypic.com/2nv5lww.png" /> <span>Choose Files</span> </div> <input id="fileInput" type="file" size="1" /> </div> CSS: #wr...
Judging by earlier questions and their lack of answers, I'm not sure there will be a good answer for this. Fortunately, we only need to support newer browsers. Looking for a layout to let us have a 3 rows with a fixed-size header and footer, but the center row is fluid with the height of the browser but will also scroll when it's conten...
I'm doing a new site and getting the following error: Property opacity doesn't exist in CSS level 2.1 but exists in : 0.5 0.5 For this chunk of CSS: .nav-next img, .nav-previous img, #all-headers img { opacity: 0.5; } This is using the Jigsaw W3C Validator. I see opacity in CSS3. Am I missing something in my stylesheet, or is ...
Using @font-face and CSS3 I want to simulate the linear gradient that you can achieve on text using Cufon color: '-linear-gradient(#7f7f7f, #616161)', I have the webkit rule -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7F7F7F), to(#616161)); but can't seem to get it to apply to the text using the color: selector or any ot...
Is there a way to style text font dynamically base on selected font in a list? For example, we can see this in Microsoft Word, where you can highlight some text and then change the font style by selecting a font style from the font dropdown box. I am trying to create a component similar to this in the browser. Current I am using the webf...
Is there any way to fetch the raw contents of a CSS file? Lets imagine that I wanted to fetch any vendor-specific css properties from a CSS file. I would need to somehow grab the CSS contents and parse them accordingly. Or I could just use the DOM to access the rules of a CSS file. The problem is that in while using the DOM, mostly all...
for example lets say i have the html <div id="container"> <div id="js-widget"> <script src"xxxyyyzzz" type="text/javascript"></script> </div> <div id=something-else1"></div> <div id=something-else2"></div> </div> what i need is js-widget to float right and something-else1 and something-else2 to start at js-widget's original posit...
I have this class set for a page im testing (just starting to try to implement CSS3 so go easy on me). .CSS3TESTDIV{ width:228px; height:300px; background-color: #fff3; background-image: -moz-linear-gradient(0% 100% 90deg, #0068b3, #fff); background-image: -webkit-gradient(linear, 0% 100%, 0% 0%, from(#fff), to(#...
I have a div with border-radius set to some value (let's say 10px), and a nested div that is the full width and height of its parent. <!-- ... --> <style type="text/css"> div.parent { display: block; position: relative; width: 100px; height: 100px; border-radius: 10px; background: #0000ff; overflow: hidden; ...
i'm trying to use a drop shadow to make it look like one div (the header) is "above" another. my problem is that the "middle" div is covering the drop shadow. i tried using z-index to put the header div about the middle div, but it's not working (the shadow is still being covered). when i put a break between the divs, i can see the shado...
Hi, I have an element that has -moz-transform applied to it with translateX(), translateY() and skew(). What I need to do is to alter the skew() value without touching the translations, using javascript. How would I accomplish this? ...
Hi, Background: I'm trying to build a web app (as a personal project using modern browsers only) that will leverage the http://www.blackoutrugby.com API. This is an online rugby mgt simulation game. The intention is to offer something powerful to the user which will calculate best teams based on current stats from their team and oppone...
Im trying to make some text non-copyable, my aim isn't to stop people from copying text from my website but more to make it easier to use. I have a list of files with file size's but I want to only copy the file names and not the file size. So far i'v tried a few different methods but non have worked, I have managed to get the text non-...
Hello, Given the following CSS3 animation.... <style type="text/css" media="screen"> .drop_box { -webkit-animation-name: drop; -webkit-animation-duration: 2s; -webkit-animation-iteration-count: 1; } @-webkit-keyframes drop { from { -webkit-transform: translateY(0px); } to { -webkit-transform: translateY(100px); ...
If I have these rules: width:50px; height:100px; -moz-transform: rotate(0deg) and then an event changes the transform to: -moz-transform: rotate(90deg) logically, shouldn't that automatically exchange the width and the height? I need the rotate to switch width and height for accurate position detection. Thanks, Joe ...
When using CSS3 and custom fonts, the client needs to download .oft or .ttf files. These files can be >50K. Can these files be compressed? How? Assuming Apache web server. I am looking for a compression technique or an Apache configuration. Any ideas will help because downloading +50K files should be prevented. ...
I'm trying to understand why Css3Pie used in conjunction with Prototype 1.6.1 crashes Internet Explorer 8. Why is this happening? Relevant information CSS3Pie [source code] is an Internet Explorer behavior (htc) that adds support for CSS3 properties like border-radius, gradients, etc. The crash only happens in IE8, not IE7 or earlier....