26th February 2009

CSS Opacity in Opera using jQuery

Whilst attempting to cross browser test a jQuery plug-in that I’m currently working on, I noticed that my opacity settings were being ignored in my current version of Opera (9.23).

$("#id").css({opacity: 0.8});

It turns out that the latest version of jQuery (1.3.1) doesn’t believe that Opera 9.2 supports CSS opacity, and therefore it is ignored completely. Read More

Browsers CSS JavaScript jQuery 2 Comments »

17th January 2009

CSS: Targeting Safari 3 only

Although Safari 3 tends to render layouts the same as the other leading popular browsers, it prefers to use it’s “aqua” button styling for standard sized form buttons.

One solution for this is to set a dimension (width or height) to the button.

To target Safari 3 in CSS you can use the following to add or override any existing attributes, such as the height of a button:

@media screen and (-webkit-min-device-pixel-ratio:0) {
	button {
		height: 40px;
	}
}

If required, multiple selectors can be added into a single block.

Browsers CSS 1 Comment »

29th October 2008

CSS: Extra Button Padding in IE

Today at work I was asked how to remove the extra padding added to buttons (both the button tag and input[type=button]) in Internet Explorer.

The Problem:

In the example below there is a standard button with 10px padding on all sides. Internet explorer chooses to add additional horizontal padding:

The solution:

After coming across this problem myself in the past, I eventually remembered that there are two CSS styles you can add to fix this bug feature in IE:

button {
	width: auto;
	overflow: visible;
}

Browsers CSS 5 Comments »

« Older Entries
Newer Entries »

Categories

Twitter

About Me

“I have a geek lifestyle, except geeks don’t have a life. Or style!”

Hi, my name is Steve and this is my blog. I am a web developer based in the United Kingdom. I like (X)HTML, CSS, Flash, ActionScript3, PHP, JavaScript, MySQL, [paste trendy words here] and Mapping APIs.