Right blocks shown on left Block in IE7

Puh. Had no chance yet to test with IE7. Don't know if I will have soon ...

If anyone could nail it down I'd be thankful.

I'd been playing with IE6 hacks and IE5.5 hacks through the whole developement process of bluebreeze. And now the same again for IE7.. Why, MS, WHY do you do this? ;-)

Screenshot attached!

BlueBreeze Fix Screenshot attached

The theme version I installed, doesn't have this issue on IE6SP2 and IE7. I looked at theme's files to find out date of release, but couldn't find it. file date stamps are 21/11/2006 probebly the day i installed it. the only problem my version has is here http://drupal.org/node/100449 my corrent version is just perfect with IE6 and IE7.

i had this problem on a live site, that im using with bluebreeze (fixed version) - so had to fix urgently. (site is itsourmovie.com)

im not a css guru, so you may regard this as a hack, but it works:

im my page.tpl.php i add this conditional comment to force any browser greater than ie6 to see my special css file:

  <?php print $styles ?>
  <!--[if gt IE 6]>
<link rel="stylesheet" type="text/css" href="../iom_files/ie7andlater.css"/>
<![endif]-->
  <?php print $scripts ?>

in this css file i put this:

/* CSS Document */

#sidebar-right	{
/*  float: right; */
  margin-left: -22%; 
  width: 154px;
  padding: 5px 8px 20px 8px;
 /* background-color:#00FF66; */
/* border: dotted;
 border-color:#00FF00; */
}

basically took out the float right, reduced the margin left, and if i remember tweaked the box width to make sure the bar had enough space. hope this helps!

I'll try to find a computer running IE7 and then I'll try to fix this.
@angurio: So is the fix working good? You have a percentage left-margin, doesn't the layout change/break when resizing?

I'm having a similar issue but its not specific to browser?!

I upgraded my Drupal site from 4.7 to 5.0 rc1, thus i downloaded the 5.x theme fore Bluebreeze (which I love by the way).... I uploaded everything except the logo (I modified mine).

When I was in the administrative area of drupal, everything was in order... everything looked fine, etc. When I clicked to go back to the main page... all hell broke loose. The leftside... was missing all blocks. and the blocks on the right started after all of the text/content loaded.... meaning... the right side blocks start where the page should have ended.... it was really weird...

so I went back to 4.7 while i tried to figure this out.... problem is, I don't know where to start.

4.7 works fine, except it blows the width of the site a little off and thus creates a horizontal scroll bar which is completely unnecessary. Check out http://ChrisLLorca.com to see what I'm talking about.

Any help would be great.

-Chris

I'm having the same problem (right sidebar displaying on top of left) with bluebreeze fixed version in IE7. I applied the hack shown above and it successfully moved the rightsidebar to the right. However, there is still a gap on the right hand side (approx 50px) which forces the sidebar to overlap some of the content area.

The website is: http://www.guernseykayaking.com

Any help would be really appreciated.

Cheers. Happy New Year!

Guys! I found the bug:

* html #sidebar-right	{
  margin-left: -150px;

around line 50 in style.css must be

html #sidebar-right	{
  margin-left: -150px;

seems the star creating the problem!

awesome! that did the job...thanks for your help

for the non-fixed version, look in layout.css rather than style.css.

This code:

* html #sidebar-right	{
  margin-left: -190px;
}

Should become:

html #sidebar-right	{
  margin-left: -190px;
}

This seems to work great for IE7 without pushing the right side column down the page.

Commited. Thanks everyone!

Great fix. Any chance this can be committed to the 4.7 branch of the theme too?

Wow, thanks. I had decided on this one for one of my sites and was quite disappointed when I saw the error in IE7. It's funny how the smallest things can cause the biggest issues.

These small fixes did not work in either the layout.css for the fluid, or the style.css for the fixed for 4.7.5. A new version for the 4.7.x branch should be released which has this minor change made. This could at the most take you ten minutes.

Right, apologies are due.
However, it is very true that upon carefully following the instructions, the problem has not been fixed. However, let's just leave the blame to MS, shall we? :)

Again, sorry, thanks.

I am using the newest version, yes.

No, I can't show you because it's on the localhost :(

Uploading the layout.css for the fluid version.

Wow, you'd think after a good ten years of using a computer you'd remember to save the file, wouldn't you! Well, my bad folks, didn't save the file. It works like a charm now.

That said, we should still get a fixed 4.7.5 theme up :)

Thanks for all your help, it's a great theme!

Well, in order to help the cause, I figured I'd make the new 4.7 version. I edited the /bluebreeze/layout.css, and the /bluebreeze/bluebreeze-fixed/style.css to take out the IE7 incompatible error. I've uploaded it with this.

This is closed, sorry it was opened in the first place. For those of you who are having trouble, either download the fixed version of the theme above, or follow the instructions above.

Another way of fixing the issue by "diovi", seems this one don't break IE5:

this is my css code (im using bluebreeze-fixed):

#sidebar-left, #sidebar-right {
  width: 138px;
  padding: 0 6px 0 6px;
  overflow: hidden;
}

#sidebar-right {
  .margin-left: -150px; /* IE7 Fix */
}

* html #sidebar-right {
  margin-left: -150px;  /* IE6 Fix*/
}

**note the period before "margin-left" in the IE7 fix, don't forget it**

look here:
http://drupal.org/node/112401

Commited http://drupal.org/node/112401.
Marking this as duplicate.