Advforum posts offscreen in IE7 [#276543]

http://www.babelup.com/content/smiley-contest is an example. Essentially, when a user using IE7 (no idea about earlier IE's, and frankly I don't really care) visits my forums, they see all the content way off-screen--some 800px.

Pixture theme, D5.7, PHP5.2, MySQL 5, no substantial theming modifications (including of advforum) except color changes. I'm marking this as critical precisely because this is how advforum is working for me basically out-of-the-box; otherwise, I wouldn't bother you with theming issues. Color.module is enabled.

If no one can help me with this issue within 24 hours I'll be forced to just turn off advforum. :-(

I'm pretty sure the issue is with the forum-comment-right rules, but not sure why that is. Here's the relevant CSS from advanced_forum-structure.css:

.forum-comment-right {
  margin-left: 150px; /*Set left margin to LeftColumnWidth*/
}

.forum-comment-right .content {
	margin: .5em;
}

#main #content .node .forum-comment .forum-comment-right .content {
  padding-right: 5px;
}

And from advanced_forum.css:

#main #content .node .forum-comment .forum-comment-right .content {
  border:none;
}
.forum-comment-right .posttitle, .forum-comment-right .content {
  padding-left: 2.5%;
  margin-left: 0;
}
.forum-comment-right p {
  margin-right: 2%;
}

Comments

Comment #1

Michelle

she/her

English

Wisconsin, USA

CreditAttribution: Michelle commented 30 June 2008 at 04:18

Title:	Content way offscreen in forums in IE7	» Advforum posts offscreen in IE7
Project:	Advanced Forum	» Pixture
Version:	5.x-1.0-alpha10	» 5.x-1.1
Category:	bug	» support
Priority:	Critical	» Normal

Yeah, there's definitely something in the pixture theme that screws up advforum. I just installed it on socnet tonight and am having the same problem. I'm about to head to bed but will look at it more tomorrow. I'm going to bump this over to the theme's queue to get their input as well since they know their theme better than I do.

Changed the issue settings a bit because theme incompatibility isn't a bug, per se, and support requests aren't critical.

Michelle

Comment #2

IceCreamYou CreditAttribution: IceCreamYou commented 30 June 2008 at 17:50

I think the issue has to do with the IE clear bug. For an illustration, see http://www.gtalbot.org/BrowserBugsSection/MSIE7Bugs/FloatedClearedBug.html

...however, everything I find about it only talks about vertical displacement, not horizontal.

EDIT: By the way, I've tried to set .clear {clear: none} in advanced_forum-structure.css but all that did was put the [reply][link][edit] buttons in the wrong place.

EDIT 2: A possible lead: http://www.positioniseverything.net/explorer/floatIndent.html

Comment #3

Michelle

she/her

English

Wisconsin, USA

CreditAttribution: Michelle commented 30 June 2008 at 18:30

I don't know much about IE bugs. I'm so not a themer. I'm hoping the Pixture folks will chime in. Unfortunately, I can't expect the Pixture theme to support all modules anymore than people can expect Advanced Forum to support all themes. Since this bug is only present when both are present, it's sort of stuck in the middle.

Michelle

Comment #4

IceCreamYou CreditAttribution: IceCreamYou commented 30 June 2008 at 20:37

I'm the same way, unfortunately, and the Pixture creator(s) haven't had any action on Drupal.org since May 9.

I'll look into the display:inline hack tonight, but if it doesn't work I have no ideas.

Comment #5

IceCreamYou CreditAttribution: IceCreamYou commented 1 July 2008 at 18:10

For the life of me, I can't even isolate the problem. This is killing me. :(

Comment #6

IceCreamYou CreditAttribution: IceCreamYou commented 1 July 2008 at 21:10

Solved! with help from a fellow dev.

In pixture's style.css, set #main-content to position: relative; - it's called the "clear float" bug in IE, something to do with floated elements not rendering correctly.

Doing that messes up node and comment titles a little, and I have yet to figure that one out. It's not bad though, and I should be able to solve that issue tonight or tomorrow morning.

Whew. Don't you hate it when you spend hours on a single little bug only to find that there's a nice elegant one-line solution?

Comment #7

Michelle

she/her

English

Wisconsin, USA

CreditAttribution: Michelle commented 2 July 2008 at 01:32

Ugh... Floats are nasty things. Thanks for getting to the bottom of it. I haven't had time to look into it. If you find something that needs to be added to advforum, let me know.

Michelle

Comment #8

IceCreamYou CreditAttribution: IceCreamYou commented 2 July 2008 at 02:06

Actually I just spent about half an hour messing with Advforum to get the titles to display correctly, because the position: relative; thing screws them up. I don't know how this will change non-Pixture themes, but I added margin-left: 150px; to .posttitle and removed margin-left: 0; from .forum-comment-right .posttitle, .forum-comment-right .content in advanced_forum.css. In advanced_forum-structure.css I set the left margin to zero in .forum-comment-right and removed everything but the padding from .posttitle.

If this isn't done, the bottom-border on the node/comment titles will look like an underline; it won't go all the way across. Also, if you've disabled comment titles, the border is a little farther down the page than it should be and just generally looks dumb.

There's probably a way to do all that without messing up "normal" themes... but as my site is fixed, I don't really have the motivation to look into it. I have to say though, Firebug is my new favorite thing on this planet.