Forums

WordPress › Support » Themes and Templates

Right Sidebar out of line in IE (8 posts)

  1. hath
    Member
    Posted 4 years ago #

    Hello, i have a small problem with a sidebar being pushed over to one side in IE, it looks like it stretches the left sidebar too, il include what im seeing in the images.

    CSS:

    body, h1, h2, h3, h4, h5, h6, blockquote, p, form{
	margin: 0;
	padding: 0;
}

body{
	margin: 0;
	font-family: Arial, Helvetica, Georgia, Sans-serif;
	font-size: 12px;
	text-align: center;
	vertical-align: top;
	background: #ffffff;
	color: #000000;
}

a:link, a:visited{
	text-decoration: underline;
	color: #11244F;
}

a:hover{
	text-decoration: none;
	color: #0156FE;
}

p{
	padding: 10px 0 0 0;
}

#wrapper{
	background: url('images/wrapperbgjp5.jpg') repeat-y;
	margin: 0 auto;
	width: 950px;
	text-align: left;
	border: 1px solid #000000;
}

#header{
	background: #81A0D9 url('images/950x240.jpg') no-repeat;
	width: 950px;
	height: 240px;
}

#menu{
	float: left;
	width: 950px;
	border-top: 1px solid #7EFF00;
	background: #81A0D9;
}

#menu ul{
	list-style: none;
	margin: 0;
	padding: 0;
}

#menu ul li{
	float: left;
}

#menu ul li a{
	display: block;
	padding: 10px;
	border-right: 1px solid #7EFF00;
	text-decoration: none;
	color: #000000;
}

#menu ul li a:hover{
	background: #f9f9f9;
}

#container{
	float: left;
	width: 530px;
	padding: 10px;
}

.post{
	padding: 10px 0 10px 0;
}

.post h2{
	font-family: Georgia, Sans-serif;
	font-size: 18px;
}

.entry{
	line-height: 18px;
}

.entry img{
	border: none;
	margin: 5px;
}

.entry img a{
	border: none;
}

p.postmetadata{
	border-top: 1px solid #D4DCF1;
	margin: 10px 0 0 0;
}

.navigation{
	padding: 10px 0 0 0;
	font-size: 14px;
	font-weight: bold;
	line-height: 18px;
}

.leftsidebar{
	float: left;
	width: 199px;
	background: #D4DCF1;
	border-left: 1px solid #7EFF00;
	margin: 0 0 0 0;
	color: #000000;
}

.leftsidebar ul{
	list-style-type: none;
	margin: 0;
	padding: 0 10px 0 10px;
}

.leftsidebar ul li{
	padding: 10px 0 10px 0;
}

.leftsidebar ul li h2{
	font-family: Georgia, Sans-Serif;
	font-size: 14px;
}

.leftsidebar ul ul li{
	padding: 0;
	line-height: 24px;
}

.rightsidebar{
	float: left;
	width: 179px;
	background: #5E74A3;
	margin: 0 0 0 0;
	color: #FFFFFF;
	padding: 10px;
}

#footer{
	clear: both;
	width: 930px;
	border-top: 1px solid #7EFF00;
	background: #81A0D9;
	padding: 10px;
	color: #ffffff;
	text-align: center;
}

  2. jonimueller
    Member
    Posted 4 years ago #

    An URL would have been more helpful.

  3. hath
    Member
    Posted 4 years ago #

    Hi jonimueller, i apologise for no URL, im working locally so have not got the theme online yet, i did post image links but they didn't show up, il try again posting the images.

    <!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 profile="http://gmpg.org/xfn/11">

	<title><?php bloginfo('name'); ?><?php wp_title(); ?></title>

	<meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />
	<meta name="generator" content="WordPress <?php bloginfo('version'); ?>" /> <!-- leave this for stats please -->

	<link rel="stylesheet" href="<?php bloginfo('stylesheet_url'); ?>" type="text/css" media="screen" />
	<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'); ?>" />

	<?php wp_get_archives('type=monthly&format=link'); ?>
	<?php //comments_popup_script(); // off by default ?>
	<?php wp_head(); ?>
</head>
<body>
<div id="wrapper">
<div id="header" onclick="location.href='<?php echo get_settings('home'); ?>';" style="cursor: pointer;">

</div>

<div id="menu">

	<ul>
		<?php wp_list_pages('depth=1&title_li='); ?>
	</ul>

</div>

<div id="container">

	<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>

	<div class="post" id="post-<?php the_ID(); ?>">

		<h2><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>

		<div class="entry">

			<?php the_content(); ?>

			<p class="postmetadata">
<?php _e('Filed under:'); ?> <?php the_category(', ') ?> <?php _e('by'); ?> <?php  the_author(); ?><br />
<?php comments_popup_link('No Comments »', '1 Comment »', '% Comments »'); ?> <?php edit_post_link('Edit', ' | ', ''); ?> Published <?php the_date('F j, Y'); ?>
				</p>

		</div>

	</div>

	<?php endwhile; ?>

		<div class="navigation">
			<?php posts_nav_link(); ?>
		</div>

	<?php else : ?>

		<div class="post">
			<h2><?php _e('Not Found'); ?></h2>
		</div>

	<?php endif; ?>

</div>

<div class="leftsidebar">

<ul>

<?php if ( !function_exists('dynamic_sidebar')        || !dynamic_sidebar('leftsidebar') ) : ?>

	<li id="search">
		<?php include(TEMPLATEPATH . '/searchform.php'); ?>
	</li>

	<li id="calendar"><h2><?php _e('Calendar'); ?></h2>
		<?php get_calendar(); ?>
	</li>

	<?php wp_list_pages('depth=3&title_li=<h2>Pages</h2>'); ?>

	<li><h2><?php _e('Categories'); ?></h2>
		<ul>
			<?php wp_list_cats('sort_column=name&optioncount=1&hierarchical=0'); ?>
		</ul>
	</li>

	<li><h2><?php _e('Archives'); ?></h2>
		<ul>
			<?php wp_get_archives('type=monthly'); ?>
		</ul>
	</li>

	<?php get_links_list(); ?>

	<li><h2><?php _e('Meta'); ?></h2>
		<ul>
			<?php wp_register(); ?>
			<li><?php wp_loginout(); ?></li>
			<?php wp_meta(); ?>
		</ul>
	</li>

<?php endif; ?>

</ul>

</div>

<div class="rightsidebar">

<?php if ( !function_exists('dynamic_sidebar')        || !dynamic_sidebar('rightsidebar') ) : ?><?php endif; ?>
this is tester text
this is tester text
this is tester text
this is tester text
</div>

<div id="footer">
<p>
Copyright © 2008 <?php bloginfo('name'); ?>
</p>
</div>

</div>
</body>
</html>

    Note: I have included links to images, just incase they still dont show up.

  4. hath
    Member
    Posted 4 years ago #

    http://img53.imageshack.us/my.php?image=bottomrn8.jpg

  5. hath
    Member
    Posted 4 years ago #

    http://img368.imageshack.us/my.php?image=topbb5.jpg

  6. jonimueller
    Member
    Posted 4 years ago #

    Well from what I can see from the images, maybe a faux column is your best best, especially since you are using a fixed width layout.
    http://www.alistapart.com/articles/fauxcolumns/

  7. hath
    Member
    Posted 4 years ago #

    Im already using a faux column, thats what the image is in wrapper CSS.

  8. hath
    Member
    Posted 4 years ago #

    Hello i just want to update that i got my problem sorted, i found an answer in this thread http://wordpress.org/support/topic/156119?replies=9#post-765341 while trying to sort a seperate problem, second post from bottom in that thread.

    Thanks :)

Topic Closed

This topic has been closed to new replies.

About this Topic

Tags