Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Are you sure you were using the correct CSS selectors?
Uhm, not sure.
In my header.php is used this code in the head section:
<!--[if IE]>
<link rel="stylesheet" type="text/css" media="all" href="http://www.perfectcatering.nl/wp-content/themes/catch-box/all-ie-only.css" />
<![endif]-->
then i copied the whole of my normal style.css into all-ie-only.css and started editing in that file.
does this help?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Try adding a significantly noticeable style in that stylesheet to explore whether it is loading;
body {
border: 10px solid red !important;
}
Ok, I tried that and it does not seem to work at all in IE10.
Although yesterday i checked on my dad’s computer(IE9) and there the changes were visible, just not the one i wanted.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Oh that explains that part, so for IE10 am i supposed to replace my
<!--[if IE]>
<link rel="stylesheet" type="text/css" media="all" href="http://www.perfectcatering.nl/wp-content/themes/catch-box/all-ie-only.css" />
<![endif]-->
For this:
<script>if(Function('/*@cc_on return document.documentMode===10@*/')()){document.documentElement.className+=' ie10';}</script>
Also, the problem still exists for IE9 and below.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
The 10-pixel, red border is working for me in IE9.
Most changes worked for me in IE9. the point is that in order to show my header properly in IE9 and below i have to change the margin-top from 52px to 98px for my menu:
#branding #access, #colophon #access-footer {
background: none repeat scroll 0 0 #3D3D3D;
clear: both;
display: inline;
float: left;
margin-bottom: 2px;
margin-top: 52px;
width: 100%;
}
but this doesn’t work when i change it in all-ie-only.css but it does when i do it in style.css but then in all other browsers there will be a big white strip underneath my header and above my menu.
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
That’s probably because you’re including your IE stylesheet right at the top of the page, before any other stylesheets. This means other stylesheets that have the same CSS selectors will override your styles.
You need to include your IE stylesheets after any other conflicting stylesheets.
You mean i have to replace the link in my header.php?
this is how my header file looks like:
<?php
/**
* The Header for our theme.
*
* Displays all of the <head> section and everything up till <div id="main">
*
* @package Catch Themes
* @subpackage Catch_Box
* @since Catch Box 1.0
*/
?><!DOCTYPE html>
<!--[if IE 6]>
<html id="ie6" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 7]>
<html id="ie7" <?php language_attributes(); ?>>
<![endif]-->
<!--[if IE 8]>
<html id="ie8" <?php language_attributes(); ?>>
<![endif]-->
<!--[if !(IE 6) | !(IE 7) | !(IE 8) ]><!-->
<html <?php language_attributes(); ?>>
<!--<![endif]-->
<head>
<!--[if IE]>
<link rel="stylesheet" type="text/css" media="all" href="http://www.perfectcatering.nl/wp-content/themes/catch-box/all-ie-only.css" />
<![endif]-->
<meta charset="<?php bloginfo( 'charset' ); ?>" />
<title><?php wp_title( '|', true, 'right' ); ?></title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="stylesheet" type="text/css" media="all" href="<?php echo get_stylesheet_uri(); ?>" />
<link rel="pingback" href="<?php bloginfo( 'pingback_url' ); ?>" />
<?php
/* Always have wp_head() just before the closing </head>
* tag of your theme, or you will break many plugins, which
* generally use this hook to add elements to <head> such
* as styles, scripts, and meta tags.
*/
wp_head();
?>
</head>
<body <?php body_class(); ?>>
<div id="page" class="hfeed">
<header id="branding" role="banner">
<hgroup>
<?php
// Check to see if the header image has been removed
$header_image = get_header_image();
if ( ! empty( $header_image ) ) :
?>
<h1 id="site-logo"><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home">
<img src="<?php header_image(); ?>" alt="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" />
</a></h1>
<?php endif; // end check for removed header image ?>
<h1 id="site-title"><span><a href="<?php echo esc_url( home_url( '/' ) ); ?>" title="<?php echo esc_attr( get_bloginfo( 'name', 'display' ) ); ?>" rel="home"><?php bloginfo( 'name' ); ?></a></span></h1>
<h2 id="site-description"><?php bloginfo( 'description' ); ?></h2>
</hgroup>
<?php
// Check to see if header search has been disable
$options = catchbox_get_theme_options();
if ( $options ['disable_header_search'] == 0 ) :
get_search_form();
endif; ?>
<nav id="access" role="navigation">
<h3 class="assistive-text"><?php _e( 'Primary menu', 'catchbox' ); ?></h3>
<?php /* Allow screen readers / text browsers to skip the navigation menu and get right to the good stuff. */ ?>
<div class="skip-link"><a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to primary content', 'catchbox' ); ?>"><?php _e( 'Skip to primary content', 'catchbox' ); ?></a></div>
<div class="skip-link"><a class="assistive-text" href="#secondary" title="<?php esc_attr_e( 'Skip to secondary content', 'catchbox' ); ?>"><?php _e( 'Skip to secondary content', 'catchbox' ); ?></a></div>
<?php /* Our navigation menu. If one isn't filled out, wp_nav_menu falls back to wp_page_menu. The menu assiged to the primary position is the one used. If none is assigned, the menu with the lowest ID is used. */ ?>
<?php if ( has_nav_menu( 'primary', 'catchbox' ) ) {
wp_nav_menu( array( 'theme_location' => 'primary', 'container_class' => 'menu-header-container' ) );
} else { ?>
<div class="menu-header-container">
<?php wp_page_menu( array( 'menu_class' => 'menu' ) ); ?>
</div>
<?php
} ?>
</nav><!-- #access -->
<?php if ( has_nav_menu( 'secondary', 'catchbox' ) ) { ?>
<nav id="access-secondary" role="navigation">
<h3 class="assistive-text"><?php _e( 'Secondary menu', 'catchbox' ); ?></h3>
<?php /* Allow screen readers / text browsers to skip the navigation menu and get right to the good stuff. */ ?>
<div class="skip-link"><a class="assistive-text" href="#content" title="<?php esc_attr_e( 'Skip to primary content', 'catchbox' ); ?>"><?php _e( 'Skip to primary content', 'catchbox' ); ?></a></div>
<div class="skip-link"><a class="assistive-text" href="#secondary" title="<?php esc_attr_e( 'Skip to secondary content', 'catchbox' ); ?>"><?php _e( 'Skip to secondary content', 'catchbox' ); ?></a></div>
<?php wp_nav_menu( array( 'theme_location' => 'secondary' ) ); ?>
</nav>
<?php } ?>
</header><!-- #branding -->
<div id="main" class="clearfix">
<div id="primary">
<div id="content" role="main">
<?php
// Passing The Slider Value and Running the slider in the Homepage or Front Page only
if ( is_home() || is_front_page() ) {
if ( function_exists( 'catchbox_pass_slider_value' ) ) { catchbox_pass_slider_value(); }
if ( function_exists( 'catchbox_sliders' ) ) { catchbox_sliders(); }
} ?>
Where should it be placed then? sorry if this is the easiest question ever (a)
Also, I didn’t include all the other [If IE] codes, what are those for?
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
You should only make changes to the themes files within a Child Theme environment, but yes, you’ll have to place the link to the IE stylesheet lower down in your header.php (but still before the </head> element.
Thank you very much! I hope this works, I’ll check when i get home.
One last question:
Where should I put the:
<script>if(Function(‘/*@cc_on return document.documentMode===10@*/’)()){document.documentElement.className+=’ ie10′;}</script>
In order for my website to work properly in IE10
(at least I read the article you linked to and i think this is the code I have to put somewhere
Thanks in advance
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
I think you should add that just before the </body> tag.
What template should that be? because there is no </body> tag in header.php
I can only find: <body <?php body_class(); ?>>
Andrew Nevins
(@anevins)
WCLDN 2018 Contributor | Volunteer support
Perhaps it’s in footer.php, but I don’t know.
