Support » Themes and Templates » Explorer displays my page awfully!!

  • Hello!!

    I have this wordpress page It looks good in firefox, but explorer displays it completely different =(. How do i go about and solving this problem?

    that is how it looks. The header is divided into 2 pictures (right and left which is a gif slideshow). The right picture is displayed BENEATH the left one in explorer?! And EVERYTHING is moved to the LEFT when it should be centered. Etc etc.

    Please help me out

    thanks alot

Viewing 11 replies - 1 through 11 (of 11 total)
  • Validating your HTML goes a long way, there are 39 errors and 31 warnings. And it is not that it is divided into 2 pictures, its that there are 2 pictures in the header and your positioning seems to be off and IE is pushing one picture down. IE and FIREFOX work differently. Try clearing up the errors and see if that helps any.

    ill do so!! thanks! =)

    well, i have fixed the CSS problems (there were like 40 problems; RESOLVED). now theres some HTML validation errors, but nothing really that should affect the OUTPUT of the webpage. ive scrolled through all the errors and most of them are just misinterpreted.

    what can be the issue? i really dont understand, thanks for all help

    You should really fix the html errrors, but can you paste your header code and i will take a look at it.

    <!DOCTYPE html>
    <html <?php language_attributes() ?> >
    <?php $options = get_option('aesthete_options'); ?>
    	<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
    <title><?php if (is_home () ) { bloginfo('name'); echo ' - '; bloginfo('description');}
    	elseif ( is_category() ) {single_cat_title(); echo ' - ' ; bloginfo('name'); }
    	elseif (is_single() ) { single_post_title(); echo ' - '. get_tags_for_post($post->ID, 'category' ).' - '. get_tags_for_post($post->ID). ' - ' ; bloginfo('name');}
    	elseif (is_page() ) { single_post_title();}
    	elseif(is_tag()) {echo 'Post tagged '; wp_title('',true); echo ' - '; bloginfo('name');}
    	else { wp_title('',true); } ?></title>
        <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    	<?php if (is_single())
    		<meta name="description" content="<?php single_post_title();?> <?php echo ' - '.get_the_excerpt() . '.' . get_tags_for_post($post->ID, 'category' )?>" />
    		<meta name="keywords" content="<?php echo get_tags_for_post($post->ID, 'category' ). get_tags_for_post($post->ID)?>" />
    	<?php }
    	elseif (is_category())
    			<meta name="description" content="<?php single_cat_title(); echo ', '; bloginfo('description');?>" />
    			<meta name="keywords" content="<?php single_cat_title(); echo ' '; bloginfo('description');?>" />
    			<meta name="description" content="<?php bloginfo('name'); echo '. '; bloginfo('description');?>" />
    			<meta name="keywords" content="<?php bloginfo('name'); echo ' '; bloginfo('description');?>" />
    	<?php }?>
    	<style type="text/css" media="screen">
    		@import url( <?php bloginfo('stylesheet_url'); ?> );
    	<link rel="alternate" type="application/rss+xml" title="RSS 2.0" href="<?php bloginfo('rss2_url'); ?>" />
    	<link rel="alternate" type="text/xml" title="RSS .92" href="<?php bloginfo('rss_url'); ?>" />
    	<link rel="alternate" type="application/atom+xml" title="Atom 0.3" href="<?php bloginfo('atom_url'); ?>" />
    	<link rel="pingback" href="<?php bloginfo('pingback_url'); ?>" />
    	<script type="text/javascript" src="<?php bloginfo('stylesheet_directory');?>/js/base64.js"></script>
    	<?php wp_get_archives('type=monthly&format=link'); ?>
    	<?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' );?>
    	<?php wp_enqueue_script('jquery'); ?>
    	<?php wp_head(); ?>
    <script type="text/javascript">
    jQuery(document).ready(function() {
     // hides the slickbox as soon as the DOM is ready
     // toggles the slickbox on clicking the noted link
      jQuery('a#slick-slidetoggle1').click(function() {
    	return false;
    <script type="text/javascript">
    jQuery(document).ready(function() {
     // hides the slickbox as soon as the DOM is ready
     // toggles the slickbox on clicking the noted link
      jQuery('a#slick-slidetoggle2').click(function() {
    	return false;
    <div id="page">
    	<div id="wrapper">
    		<?php if ($options['use_graph_header']):?>
    			<div id="header">
    				<a href="<?php echo get_option('home'); ?>">
    						<img src="<?php bloginfo('stylesheet_directory');?>/img/head-b.jpg" width="683" height="177" border="0"/><img src="<?php bloginfo('stylesheet_directory');?>/img/logo.gif" width="239" height="177" border="0"/>
    		<?php else:?>
    			<div id="header">
    				<a href="<?php echo get_option('home'); ?>" class="headerimg" style="width:<?php echo $options['header_image_width']?>px;">
    					<?php if ($options['header_image']==3 && $options['image_url']):?>
    						<img src="<?php echo $options['image_url']?>" border="0" class="headerimg"/>
    					<?php elseif($options['header_image']==1):?>
    						<img src="<?php bloginfo('stylesheet_directory');?>/img/headerslide.gif" width="450" height="262" border="0" class="headerimg" />
    					<?php endif;?>
    				<img src="<?php bloginfo('stylesheet_directory');?>/img/logga5.jpg" width="519" height="232" border="0" class="headerright" />
    				<?php if (!$options['hide_blog_title']):?>
    					<div class="headerimg"  style="padding-top:<?php $pad=max(0,$options['header_image_height']-97); echo $pad;?>px">
    						<?php if (is_home()):?>
    							<h1 <?php if ($options['blog_title_size']) echo 'style="font-size:'.$options['blog_title_size'].'px"'?>><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h1>
    						<?php else:?>
    							<h3 <?php if ($options['blog_title_size']) echo 'style="font-size:'.$options['blog_title_size'].'px"'?>><a href="<?php echo get_option('home'); ?>/"><?php bloginfo('name'); ?></a></h3>
    						<?php endif;?>
    							<div class="description"><?php bloginfo('description'); ?></div>
    				<?php endif; ?>
    				<div class="clear"></div>
    		<?php endif;?>
    		<div id="whitepage">
    			<div id="whitepagesidebg">
    				<div id="whitepagetopbg">
    					<div id="whitepagebottombg">
    						<div id="navdiv">
    						<ul id="nav">
    			<?php /*?><li <?php if(!is_page()) echo 'class="current_page_item"'; ?>><a href="<?php echo get_option('home'); ?>/"><?php _e('Home');?></a></li><?php */?>
    			<?php wp_list_pages('title_li=&exclude=65,137,168,169,173,235,238'); ?>
    						<div class="clear"></div>
    <!-- end header -->

    Here is a quick fix……..

    get rid of the logo and replace your header css with this. It pushes the logo to a background element and leaves the gif in place

    #header {
    margin : 0;
    margin-top : 40px;
    padding : 0 0 9px 0;
    background : url( no-repeat;
    background-position:100% 10%;

    ooooooooh!!!!!!!! THAAANK YOU!!!!! WOW!!

    do u see the problem when u go to “kurser/schema” ??? it should be three images (kids, youth and adults) and beneath each of them the picture of the schedule, like three columns. whats up with that???

    Change the width of the leftcontent div.

    this code should work, just replace again.

    #leftcontent {
    display : inline;
    margin : 28px 10px 10px 20px;
    padding : 0 10px 5px 0;
    width : 990px;
    float : left;
    border-bottom : 1px dotted #000000;

    but then the border-bottom dotted extends as well, goin outside of the main-border

    Would help if I could view the site live to see what you are talking about now =\ I am sure that width can be modified a few pixels give or take.

Viewing 11 replies - 1 through 11 (of 11 total)
  • The topic ‘Explorer displays my page awfully!!’ is closed to new replies.