Is there a better way to do this in CSS ?

Is there a better way to do this in CSS ?
by

1 Answer

Answer :

answer:You could use CSS Sprites… at a very basic level, what you do it’s that both “states” of the image are on the same file, and on :hover, you use background-position to reveal the “active” image. You may have to edit your (X)HTML, but it should do the trick and it should work on all modern browsers. You could also try: .highligtit img{ filter: alpha(opacity=50); /* for MSIE */ opacity:0.5; /* for Firefox, Safari and Opera */ -moz-opacity:0.5; /* for Firefox (just in case) */ } It would still not validate in CSS2.1, since “opacity” it’s a CSS3 property, but at least it would work in most browsers.
by

Related questions

What's the easiest way to learn how to code in CSS and PHP?

Description : What's the easiest way to learn how to code in CSS and PHP?

Last Answer : tizag.com

How do i change the color of a hyperlink with in-line CSS?

Description : How do i change the color of a hyperlink with in-line CSS?

Last Answer : answer:Link Text For the color you can put the name (green, red, etc…) or use hexadecimal.

How to create a good navigation bar with CSS?

Description : How to create a good navigation bar with CSS?

Last Answer : Check out California's WebTools site, and see if the navigation there does what you want. All the code is freely downloadable, and you can customize it to suit your needs. The part that highlights the ... done with a tiny piece of JavaScript. We do all of the State's web sites with this template.

CSS Help?

Description : CSS Help?

Last Answer : Hello! I’d be happy to help, but I need more information. What exactly are you trying to accomplish here?

How to magnify three links with CSS?

Description : How to magnify three links with CSS?

Last Answer : answer:I would first assign a CSS class—let’s call it magnify—to all of the links, like so: Google Yahoo MSN Then, define that class in CSS as follows: a:hover.magnify { font-size: 1.2em; } Change the value of the font-size property to increase or decrease the amount of magnification.

What's the difference in #FFF and #FFFFFF in CSS and why does it matter?

Description : What's the difference in #FFF and #FFFFFF in CSS and why does it matter?

Last Answer : answer:The triplet is still technically hexadecimal but it is a shortcut. All it does is repeat each of the values and use that for the RGB. #333 becomes #333333, #abc becomes #aabbcc etc. ... Nowadays that is becoming less useful since so many devices can display large numbers of colours natively.

How can using CSS help make a web site better or easier?

Description : How can using CSS help make a web site better or easier?

Last Answer : One way they help is by putting all of your formatting, styles, colors, etc in one easily changeable file. You can, for example.. have one file that tells your whole website how to look.. ... can be controlled by this one simple cascading style sheet. See this introduction for more info about it.

What's the better CSS framework for you?

Description : What's the better CSS framework for you?

Last Answer : Well, I’ve heard nice things about blueprint, but I opt out of the css framework. Most of my web apps are to specific to warrant a framework.

What's the best way to redesign and test a website's CSS that you don't control?

Description : What's the best way to redesign and test a website's CSS that you don't control?

Last Answer : Turn your own machine into a webserver. http://www.apachefriends.org/en/xampp.html

Is there a way to get an "onrelease" state using CSS?

Description : Is there a way to get an "onrelease" state using CSS?

Last Answer : answer:I believe with just CSS the only pseudo-class that would come close is :hover for example .class:hover{ } . Unless there is something new that has come out. your best bet would be to would ... would also be more compatible with IE 6 (if your concerned) as IE 6 does not support :hover.

What is the best way to learn how to layout your design images using CSS?

Description : What is the best way to learn how to layout your design images using CSS?

Last Answer : I learnt CSS layout in this tutorial

what's the easiest way to learn css?

Description : what's the easiest way to learn css?

Last Answer : answer:Check out the “Siblings” questions on the right for some good ideas… well, at least this one: http://ask-public.com/disc/3608/how-should-i-start-to-learn-html-css-and-java/ You might check out Adobe Dreamweaver CS3 as well.

Web design (CSS) question: how can I make something like this?

Description : Web design (CSS) question: how can I make something like this?

Last Answer : Looks like it’s based on Cargo Collective’s Montessori template and using their tools. They’ve modified it some to use some more concepts from brutalism, but it looks like all the main functionality would be there if you wanted to do the same.

When upgraded from appsrv to wamp, wordpress single pages css gone, why?

Description : When upgraded from appsrv to wamp, wordpress single pages css gone, why?

Last Answer : answer:Check your source that's generated, I would imagine the path to your stylesheet is coming out as a relative path for some reason so it's not picking up correctly when the path is longer. ... Address are correct (Settings -> General), along with your theme settings (Appearance -> Themes).

Web Design: CSS Problem Driving Me Crazy! What's Causing this?

Description : Web Design: CSS Problem Driving Me Crazy! What's Causing this?

Last Answer : My guess is that #left-foot and #right-foot have absolute positioning.

Does anyone know of a tool to search the CSS of an entire site and ensure a CSS specifier hasn't been previously used before assigning it?

Description : Does anyone know of a tool to search the CSS of an entire site and ensure a CSS specifier hasn't been previously used before assigning it?

Last Answer : Firebug (for Firefox) will show every style for a specific tag or id, or class… etc.

What is the best text editor for HTML/XHTML/CSS/PHP/SQL on Ubuntu?

Description : What is the best text editor for HTML/XHTML/CSS/PHP/SQL on Ubuntu?

Last Answer : Take a look at Geany

Anyone know of a good free website hosting site that allows .css files?

Description : Anyone know of a good free website hosting site that allows .css files?

Last Answer : answer:Not sure if I'm understanding you correctly, but the css file would just be linked from the html files you've made. So it's not that you'd make your content files into css files, you'd ... doesn't support css files. Does that help? Am I misunderstanding? Perhaps a link to the site would help?

What does background: transparent do in Eric Meyer's reset.css?

Description : What does background: transparent do in Eric Meyer's reset.css?

Last Answer : This is used to override any unexpected browser defaults of an opaque background on an element such as . I wouldn’t worry too much about it since it was added to fix unusual browser settings.

OK, !@*&% CSS, Why Won't My Headline Center?

Description : OK, !@*&% CSS, Why Won't My Headline Center?

Last Answer : The only thing I can think is that you have div.one-col set to display: inline. When I remove that formatting (using Google Chrome's developer tools), it does indeed center. (It also screws up ... the calendar disappears, but I'm betting you can fix that once you've addressed the July thing .)

How do I override earlier styles in my CSS stylesheet?

Description : How do I override earlier styles in my CSS stylesheet?

Last Answer : answer:Are the unique styles inline? That should do it. Like this: This is a paragraph. http://www.w3schools.com/CSS/css_howto.asp

How to use "add custom CSS" in Tumblr?

Description : How to use "add custom CSS" in Tumblr?

Last Answer : Just go to your dashboard, make sure your blog is selected on the right, and click on “customize”; from there you can go to “theme”, and click on “enable custom HTML”.

Tumblr css help?

Description : Tumblr css help?

Last Answer : answer:My instinct is that CSS will not be able to help you with this probably some scripting and HTML is in order. CSS will only change the look and feel of a page, not the function (having a ... any themes that have this functionality, and can you look at the code to figure out how it's done?

A question about CSS and DIV alignment?

Description : A question about CSS and DIV alignment?

Last Answer : answer:Drop a clear: both; on your div for the footer/bottom. #bottom { background:url(“images/bottom.png”) no-repeat scroll 0 0 transparent; clear:both; height:21px; position:relative; width:959px;

Is there a code for CSS/Javascript to keep your contents in place when re-sizing a window?

Description : Is there a code for CSS/Javascript to keep your contents in place when re-sizing a window?

Last Answer : Is your site fixed width?

Does the buttons background color at Fluther.com made with CSS only or it is an image?

Description : Does the buttons background color at Fluther.com made with CSS only or it is an image?

Last Answer : answer:It's an image. Fluther uses sprites to compress the amount of image downloading the user does with each page request. If you look at the sprite image the buttons are there. Note that ... If you look at Google using Safari or Chrome, the visual effect is accomplished entirely without images.

HTML vs. CSS?

Description : HTML vs. CSS?

Last Answer : The point of CSS is to capture style information in a single location..Not only is this good coding pracitice, but if you use the CSS styles consistently, you can change the look of your web site simply by modifying the CSS. Think ‘Skins’.

Using css how can I make my background fit to the screen automatically?

Description : Using css how can I make my background fit to the screen automatically?

Last Answer : I would be better able to help you if you could be slightly more specific. Are you using as image as your background? A gradient? Some code or a link would also help. Hope to hear back from you soon!

Can Someone Explain The Css & HTML for tumblr?

Description : Can Someone Explain The Css & HTML for tumblr?

Last Answer : This may help you understand it a bit better.

One more time... what am I doing wrong now with this CSS?

Description : One more time... what am I doing wrong now with this CSS?

Last Answer : What do you want to do with your CSS? I need to see an example of what’s happening now, and then know what you want it to do diferently. Given that, I’ll try to help.

Holiday CSS themes - when and what?

Description : Holiday CSS themes - when and what?

Last Answer : We change things around when we feel like it, or when a user gives us a compelling reason to (as I explained in this blog post).

Does anyone know of a good guide explaining how to position elements using CSS?

Description : Does anyone know of a good guide explaining how to position elements using CSS?

Last Answer : Google “css box model tutorial” and start experimenting. Don’t worry, it was a blur starting out for me too.. www.csszengarden.com is a great place to get inspiration too..

Implementing CSS @font-face from start to finish?

Description : Implementing CSS @font-face from start to finish?

Last Answer : The files you're looking for are the EOT and OTF/TTF (interchangeable here) files. The other src values are saying if they already have this font then sweet, just use that. IE ... software for converting OTF into EOT here: http://www.microsoft.com/typography/web/embedding/weft3/download.aspx

Why do some websites put a "Validate XHTML/CSS" link on their external website?

Description : Why do some websites put a "Validate XHTML/CSS" link on their external website?

Last Answer : valid markup helps search engines for one, it is also to show you know how to properly code a website. So if you are a freelancer for example, and a small firm wants to outsource some work to you they can, without having to ask, see your site is built of proper, validated code.

Why is the word pseudo often used when referring to CSS or maybe all code?

Description : Why is the word pseudo often used when referring to CSS or maybe all code?

Last Answer : Could you give us an example? Generally when people say pseudo code, they’re referring to code that isn’t actual code, but is explaining how code statements work. Such as: if (the cat is wet) { meow anxiously; }

Can anyone help me with some CSS?

Description : Can anyone help me with some CSS?

Last Answer : How is it jumbled? Often for IE i use a second stylesheet and apply it using : < ![endif]—> The first one is your first stylesheet, the second is a stylesheet that only fixes the things that are bad in IE.

How to master HTML, CSS and/or Photoshop on a shoestring budget?

Description : How to master HTML, CSS and/or Photoshop on a shoestring budget?

Last Answer : This this the best place to start learning about HTML and xHTML. Also PHP, CSS and others. > W3Schools I can’t remember how I got started in Photoshop… hmm basically just start messing about and then if you can think of something specific you would like to try then search for a tutorial.

Any designers/developers use the blueprint css?

Description : Any designers/developers use the blueprint css?

Last Answer : I used it for around two or three sites I created then dropped it. The fact of the matter is that CSS is so easy (for me anyways) that I see no point in using it. I have a general layout ... complete CSS noob then yeah, I guess blueprint CSS would be a good start to help you get away from tables.

CSS Question: What to do with fonts if the user end doesnt have it on their computer?

Description : CSS Question: What to do with fonts if the user end doesnt have it on their computer?

Last Answer : Currently this is basically only available in Webkit-based browsers such as Safari and Chrome. This is a touchy subject with a lot of designers. Your best bet is sIFR which uses Flash and JavaScript to ... doing those, just specify back up fonts. Like so: font-family: Helvetica, Arial, sans-serif;

When designing under css, what techniques do you guys use to test across different browsers?

Description : When designing under css, what techniques do you guys use to test across different browsers?

Last Answer : I kinda open it in different browsers.

DIV class & id name parser for automatic CSS file generation?

Description : DIV class & id name parser for automatic CSS file generation?

Last Answer : I saw something on reddit today about something called HSS, I can’t remember the link but google it, it sounded like it does what you want.

How to teach XHTML, CSS, and PHP?

Description : How to teach XHTML, CSS, and PHP?

Last Answer : Not having a clue about how to do these things, I think your answer lies in your own experience-you had to go through the challenge of working it out yourself-sometimes it was hard. I don't know ... hard work-no substitute for that. And that's also the fun of it. And the feeling of accomplishment.

Any suggestions as to where to look for information on how to edit CSS in Squarespace?

Description : Any suggestions as to where to look for information on how to edit CSS in Squarespace?

Last Answer : Learn CSS?

Can anyone give me some CSS positioning help?

Description : Can anyone give me some CSS positioning help?

Last Answer : Care to share what you think is wrong? Other than the red mess on the right it seems to render alright in Firefox.

Can someone please explain to me exactly how PHP, mySQL, Javascript, and HTML/CSS are related?

Description : Can someone please explain to me exactly how PHP, mySQL, Javascript, and HTML/CSS are related?

Last Answer : PHP is a serverside language, while JavaScript and mySQL are clientside languages. I think the difference is that PHP/HTML is the language used by the server to encode instructions for the web browser, ... have no idea whether it's accurate or not. I just started learning this stuff this week.

Curved borders in HTML/CSS?

Description : Curved borders in HTML/CSS?

Last Answer : images.

What is the difference/relationship between HTML and CSS?

Description : What is the difference/relationship between HTML and CSS?

Last Answer : HTML is the structure of the document. So the HTML would look like. Hello World And the CSS could be. CSS defines the look. H1 { font-family: Verdana, Arial, Helvetica, sans-serif; border-size: thin ... 400px; } Take a peek here.. http://www.pillowpersuasion.com/dance/blank.html Look at the source.

How to give 3 floated div's the same height in CSS?

Description : How to give 3 floated div's the same height in CSS?

Last Answer : Never mind. I’ve gone back to tables. (but only for that part) Div’s can be very, very, very painful sometimes…

How do I style input boxes using HTML/CSS?

Description : How do I style input boxes using HTML/CSS?

Last Answer : I recommend downloading Firefox and the plugin Firebug (getfirebug.com). It's amazing. Then you can go to any website (like apple.com), press the green checkbox in the bottom right to open ... site in Safari because that browser has special rules about displaying input boxes--it's more restrictive.

How do I remove spaces around images in a CSS drop down menu in IE?

Description : How do I remove spaces around images in a CSS drop down menu in IE?

Last Answer : answer:sorry to dp.. but here's the code i'm working with. http://www.mosaicfound.org/NEW/common/top.php