WordPress.org

Ready to get started?Download WordPress

Forums

Problem with alignment in IE (8 posts)

  1. adtkb
    Member
    Posted 2 years ago #

    Hi all. I am new to WordPress and come from the design side so I am still learning (slowly) about coding and php functionality.

    I used a template (Solid from bitpub at themeforest) to develop this site and made some modifications to customize it. I am 95% there and have it looking great in all browsers, except IE. I know there are other posts and resolutions, but I can't figure out how to resolve the alignment issue I am getting with IE. I did not paste any content from Word, I read that can cause issues. Again, I am very new to this. I have run the site through the verification and notice that I have some errors, but I am not sure how to fix them or where to find the lines that need to be fixed. I have WP installed on the hosting server in a subfolder and therefore don't have Dreamweaver linked up to edit.

    Any help would greatly be appreciated. I am hoping to do some more sites and become a contributor as I learn more, but for now, I have to fake it until I make it!

    Here is my site:

    http://askbluestone.com/wp1

    Thanks,
    Tim

  2. Raby Yuson
    Member
    Posted 2 years ago #

    Remove this style block at the very beginning of your header.php..

    <style type="text/css">
    .home.page.page-id-43.page-template.page-template-showcase-php #wrap #content {
    	background-color: #FEFEFE;
    }
    </style>

    place it inside the <head></head> tag.

    raby

  3. adtkb
    Member
    Posted 2 years ago #

    Raby - Thanks for the quick response! As I look at the header.php file, this is what I see:

    <?php
    	global $doctype;
    	global $class;
    	?>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" />
    <style type="text/css">
    /*<![CDATA[*/
    .home.page.page-id-43.page-template.page-template-showcase-php #wrap #content {
            background-color: #FEFEFE;
    }
    /*]]>*/
    </style>
    <!--[if lt IE 7 ]> <html class="ie6" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 7 ]>    <html class="ie7" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 8 ]>    <html class="ie8" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 9 ]>    <html class="ie9" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if (gt IE 9)|!(IE)]><!--><!--<![endif]-->
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>- askbluestone.com</title>
    	<!-- //////// Favicon ////////  -->
    	<link href="<?php echo get_template_directory_uri(_layout/images/favicon.ico); ?>/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    
    	<script type="text/javascript">
    		var themePath = '<?php echo get_template_directory_uri(); ?>';
    		var themeCufon = '<?php echo get_option( EWF_SETUP_THNAME.'_cufon', 'true'); ?>';
    		var themeSliderTimeout = <?php echo get_option( EWF_SETUP_THNAME.'_slider_timeout', '5000'); ?>;
    
    		var msg_newsletter_error = '<?php echo __('please enter a valid email...', EWF_SETUP_THEME_DOMAIN); ?>';
    		var msg_newsletter_label = '<?php echo __('subscribe to newsletter...', EWF_SETUP_THEME_DOMAIN); ?>';
    
    	</script>
    
    	<?php wp_head(); ?>
    </head>

    It seems that style block IS inside the <head></head> tag.

    I did try to pull it out and remove it completely as well, with no success.

    I wonder if it isn;t an issue with the "wrap" measurement or the content within the wrap as the footer has the same alignment issue.

    I also tried adding this to the very first line of the header.php document:

    <!DOCTYPE html>

    But it displayed on the site, so I don;t think that was right.

    Thanks again for the help. Any other suggestions?

  4. Raby Yuson
    Member
    Posted 2 years ago #

    sorry I think I confused you as to where to delete the line I mentioned above. those lines are actually not hardcoded but echoed out by your global variable ($class) located inside your header.php at the beginning:

    <?php
        global $doctype;
        global $class;
    ?>

    this declaration is what outputs the <style></style> tag I viewed from your home page's source. this is the line that you need to get rid of.

    I also mentioned adding the Doctype declaration a while ago coz when I debugged your site I didn't see that appear in my browser. This is needed by IE if you want to use the margin:0 auto which centers your content.

    try that and let me know.

  5. adtkb
    Member
    Posted 2 years ago #

    Thanks again, but no luck.

    Here is the header.php as I have it now (through the end of the </head> tag.

    <head>
    <!DOCTYPE html>
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" />
    <style type="text/css">
    /*<![CDATA[*/
    .home.page.page-id-43.page-template.page-template-showcase-php #wrap #content {
            background-color: #FEFEFE;
    }
    /*]]>*/
    </style>
    <!--[if lt IE 7 ]> <html class="ie6" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 7 ]>    <html class="ie7" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 8 ]>    <html class="ie8" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 9 ]>    <html class="ie9" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if (gt IE 9)|!(IE)]><!--><!--<![endif]-->
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>- askbluestone.com</title>
    	<!-- //////// Favicon ////////  -->
    	<link href="<?php echo get_template_directory_uri(_layout/images/favicon.ico); ?>/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    
    	<script type="text/javascript">
    		var themePath = '<?php echo get_template_directory_uri(); ?>';
    		var themeCufon = '<?php echo get_option( EWF_SETUP_THNAME.'_cufon', 'true'); ?>';
    		var themeSliderTimeout = <?php echo get_option( EWF_SETUP_THNAME.'_slider_timeout', '5000'); ?>;
    
    		var msg_newsletter_error = '<?php echo __('please enter a valid email...', EWF_SETUP_THEME_DOMAIN); ?>';
    		var msg_newsletter_label = '<?php echo __('subscribe to newsletter...', EWF_SETUP_THEME_DOMAIN); ?>';
    
    	</script>
    
    	<?php wp_head(); ?>
    </head>

    I tried it both like that and with the <head> tag starting before the <style> tag.

    Thanks for working with me on this. This is really the last piece to get this site live.

  6. Raby Yuson
    Member
    Posted 2 years ago #

    Nope, not like that but like this:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <!--[if lt IE 7 ]> <html class="ie6" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 7 ]>    <html class="ie7" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 8 ]>    <html class="ie8" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if IE 9 ]>    <html class="ie9" xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US" > <![endif]-->
    <!--[if (gt IE 9)|!(IE)]><!--><!--<![endif]-->
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta name="generator" content="HTML Tidy for Linux (vers 25 March 2009), see www.w3.org" />
    <title>- askbluestone.com</title>
    <!-- //////// Favicon ////////  -->
    <link href="<?php echo get_template_directory_uri(_layout/images/favicon.ico); ?>/favicon.ico" rel="shortcut icon" type="image/x-icon" />
    
    <style type="text/css">
    /*<![CDATA[*/
    .home.page.page-id-43.page-template.page-template-showcase-php #wrap #content {
            background-color: #FEFEFE;
    }
    /*]]>*/
    </style>
    
    	<script type="text/javascript">
    		var themePath = '<?php echo get_template_directory_uri(); ?>';
    		var themeCufon = '<?php echo get_option( EWF_SETUP_THNAME.'_cufon', 'true'); ?>';
    		var themeSliderTimeout = <?php echo get_option( EWF_SETUP_THNAME.'_slider_timeout', '5000'); ?>;
    
    		var msg_newsletter_error = '<?php echo __('please enter a valid email...', EWF_SETUP_THEME_DOMAIN); ?>';
    		var msg_newsletter_label = '<?php echo __('subscribe to newsletter...', EWF_SETUP_THEME_DOMAIN); ?>';
    
    	</script>
    <?php wp_head(); ?>
    </head>

    Here is a quick tutorial about Doctypes - http://www.w3schools.com/tags/tag_doctype.asp

    -raby

  7. adtkb
    Member
    Posted 2 years ago #

    Raby,

    Thanks so much for the help. That worked! I noticed though that this bit of code is messing it up. It has to do with the "wrap" classification. I fI include this code after the <head> tag, the site still looks perfect in all browsers except IE. If I remove it, the alignment is correct in IE and other browsers, but there is no "wrap" section and the background image.

    Any suggestions on this one?

    <body <?php body_class($class); ?>>
    	<div id="wrap">
    
    		<noscript>
    			<link href="<?php echo get_template_directory_uri(); ?>/style-nojs.css" rel="stylesheet" type="text/css" />
    			<div class="nojs-warning"><strong><?php _e('JavaScript seems to be Disabled!', EWF_SETUP_THEME_DOMAIN); ?></strong> <?php  _e('Some of the website features are unavailable unless JavaScript is enabled.', EWF_SETUP_THEME_DOMAIN); ?></div>
    		</noscript>
  8. ddavout
    Member
    Posted 1 year ago #

    the link tag
    <link href="<?php echo get_template_directory_uri(); ?>/style-nojs.css" rel="stylesheet" type="text/css" />
    is not allowed here.

Topic Closed

This topic has been closed to new replies.

About this Topic