Forum Replies Created

Viewing 10 replies - 16 through 25 (of 25 total)
  • Thread Starter nickmeul

    (@nickmeul)

    So in practice:

    I need to change the margin-top to 98px. does this mean i have to add:

    .ie10 #branding #access, #colophon #access-footer {
        background: none repeat scroll 0 0 #3D3D3D;
        clear: both;
        display: inline;
        float: left;
        margin-bottom: 2px;
        margin-top: 98px;
        width: 100%;
    }

    to my style.css?

    this was the original code:

    #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%;
    }
    Thread Starter nickmeul

    (@nickmeul)

    I came across this comment:

    Both solutions posted here (with slight modifications) work:

    <!–[if !IE]><!–><script>if(/*@cc_on!@*/false){document.documentElement.className=’ie10′;}</script><!–<![endif]–>

    or

    <script>if(Function(‘/*@cc_on return 10===document.documentMode@*/’)()){document.documentElement.className=’ie10′;}</script>

    You include either of the above lines inside of head tag of your html page before your css link. And then in css file you specify your styles having “ie10” class as a parent:

    .ie10 .myclass1 { }

    And voilà! – other browsers stay intact. And you don’t need jQuery. You can see the example how I implemented it here: https://kardash.net.

    Can you please explain me what he means with the Bold part, what is the code i have to add to my css?

    Thanks in advance

    Thread Starter nickmeul

    (@nickmeul)

    Okay, i placed the script just before </body>, i tried placing it in the header too, nothing seems to change the IE10 display for me, nothing has changed.. is there anything else I can do? or is this script just not right?

    Thread Starter nickmeul

    (@nickmeul)

    What template should that be? because there is no </body> tag in header.php
    I can only find: <body <?php body_class(); ?>>

    Thread Starter nickmeul

    (@nickmeul)

    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

    Thread Starter nickmeul

    (@nickmeul)

    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="https://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="https://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?

    Thread Starter nickmeul

    (@nickmeul)

    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.

    Thread Starter nickmeul

    (@nickmeul)

    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="https://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.

    Thread Starter nickmeul

    (@nickmeul)

    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.

    Thread Starter nickmeul

    (@nickmeul)

    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="https://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?

Viewing 10 replies - 16 through 25 (of 25 total)