CODEWITHSUNDEEP
csswordpressinternet-explorer-7
torishig
torishig

Reputation: 1

wordpress stylesheet loading

In IE7, display: inline-block doesn't work.

In my wordpress site in style.css, I have defined:

#footerlinks li {display:inline-block;list-style-type:none;height:25px;}

style.css is coming from functions.php using:

wp_enqueue_style( 'style', get_stylesheet_uri() );

For IE7, I want to use: 

#footerlinks li {_height:25px;zoom:1;*display:inline;list-style-type:none;}

What code should I use and where should I put it ?

Kind Regards R

Upvotes: 0

Views: 181

Answers (3)

feeela
feeela

Reputation: 29932

The offical way, to use conditional comments would be:

wp_enqueue_style( 'my-style', WP_PLUGIN_URL . '/my-plugin/style.css' );
global $wp_styles;
$wp_styles->add_data( 'my-style', 'conditional', 'lte IE 7' );

source: http://core.trac.wordpress.org/ticket/10618#comment:6

Upvotes: 2

McNab
McNab

Reputation: 6777

The best eay to handle this is using a conditional stylesheet. In the <head> section of your header.php include the following;

<!--[if IE 7]><link rel="stylesheet" href="<?php bloginfo('template_url'); ?>/css/ie7.css" type="text/css" media="screen" /><![endif]-->

Make sure it is after the <?php wp_head(); ?> call or the style will not override the styles.css value.

Then you add your;

#footerlinks li {_height:25px;zoom:1;*display:inline;list-style-type:none;}

to a file called ie7.css and place it in the css directory (or wherever you want, that's based on my example).

This will be applied to IE7 only.

Upvotes: 0

Jure C.
Jure C.

Reputation: 3080

In your header.php after wp_head()

<!--[if IE 7]>
<link rel="stylesheet" href="my.ie7.css">
<![endif]-->

That's it. Read more about conditional includes on quirksmode: http://www.quirksmode.org/css/condcom.html

Upvotes: 0

Related Questions