WordPress.org

Support

Support » Themes and Templates » CSS file needed to edit my website in IE?

CSS file needed to edit my website in IE?

  • nickelbert

    @nickelbert

    I have my website done in Firefox @ http://nickhiebert.com using a style.css file (which is complete). What would I use to edit it in IE? IE has some problems with the headerimg and navigation (pages)

    Anyone have an idea? So it would link properly so I can edit it. my idea is style_ie.css?

Viewing 10 replies - 1 through 10 (of 10 total)
  • jrav001

    @jrav001

    In your header, use something like this:

    <!-- Internet Explorer Hacksheets -->
    <!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/css/ie6.css" />
    <![endif]-->
    <!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/css/ie.css" />
    <![endif]-->
    <!--[if lte IE 7]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/css/ie.css" />
    <![endif]-->
    <!--[if lte IE 8]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>/css/ie.css" />
    <![endif]-->

    nickelbert

    @nickelbert

    It was mainly done for Firefox.

    nickelbert

    @nickelbert

    Why is there 2 IE6?

    <!–[if lte IE 6]>
    <link rel=”stylesheet” type=”text/css” href=”<?php bloginfo(‘template_directory’); ?>/css/ie6.css” />
    <![endif]–>
    <!–[if lte IE 6]>
    <link rel=”stylesheet” type=”text/css” href=”<?php bloginfo(‘template_directory’); ?>/css/ie.css” />
    <![endif]–>

    nickelbert

    @nickelbert

    When I do updates for that file it doesn’t work…

    That looks like valid — oh the irony!– IE conditional tags so maybe you didn’t put them in the right place. The tags need to go between <head> and </head> and of course the links need to point to actual css files.

    nickelbert

    @nickelbert

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <!-- Internet Explorer Hacksheets -->
    <!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>http://nickhiebert.com/wp-content/themes/portfolio/ie6.css" />
    <![endif]-->
    <!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>http://nickhiebert.com/wp-content/themes/portfolio/ie.css" />
    <![endif]-->
    <!--[if lte IE 7]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>http://nickhiebert.com/wp-content/themes/portfolio/ie.css" />
    <![endif]-->
    <!--[if lte IE 8]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>http://nickhiebert.com/wp-content/themes/portfolio/ie.css" />
    <![endif]-->
    <title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> &raquo; Blog Archive <?php } ?> <?php wp_title(); ?></title>
    <link rel="shortcut icon" type="image/ico" href="http://www.nickhiebert.com/wp-content/themes/portfolio/images/favicon.ico"/>
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
    
    </head>
    nickelbert

    @nickelbert

    Not sure why ie5.css is needed though @apljdi, @jrav001

    Here is the problem:

    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>http://nickhiebert.com/wp-content/themes/portfolio/ie6.css" />

    That is going to give you a bad url– something like http://nickhiebert.com/wp-content/themes/portfoliohttp://nickhiebert.com/wp-content/themes/portfolio/ie6.css. That is also not what jrav001 posted. Look up. You should see the difference. You should also put the IE stuff after the other stylesheet loads to make sure that the IE conditional css overwrites the normal css.

    You probably don’t have to worry too much about IE5. At best its maybe 1% and dying fast.

    nickelbert

    @nickelbert

    Here is what I got in the head of header.php

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    
    <title><?php bloginfo('name'); ?> <?php if ( is_single() ) { ?> &raquo; Blog Archive <?php } ?> <?php wp_title(); ?></title>
    <link rel="shortcut icon" type="image/ico" href="http://www.nickhiebert.com/wp-content/themes/portfolio/images/favicon.ico"/>
    <link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
    <!-- Internet Explorer Hacksheets -->
    <!--[if lte IE 6]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>http://nickhiebert.com/wp-content/themes/portfolio/ie.css" />
    <![endif]-->
    <!--[if lte IE 7]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>http://nickhiebert.com/wp-content/themes/portfolio/ie.css" />
    <![endif]-->
    <!--[if lte IE 8]>
    <link rel="stylesheet" type="text/css" href="<?php bloginfo('template_directory'); ?>http://nickhiebert.com/wp-content/themes/portfolio/ie.css" />
    <![endif]-->
    
    </head>

    Also does anyone know how to hack Opera and Safari? Safari 4 looks good just one error and Opera has a problem with the navigation.

    Yes, you’ve still got in your header exactly what I told you is wrong. View-source to prove it to yourself then pay attention to what jrav001 wrote. In short, you don’t want bloginfo('template_directory') and a full URL. bloginfo creates most of that url.

    There are no conditional tags for any browser besides IE, so far as I know. There might be some css hacks but where I’ve had trouble with Safari I’ve just added a class to the very few elements that are problematic and tweaked the display without needing any real hacks.

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘CSS file needed to edit my website in IE?’ is closed to new replies.
Skip to toolbar