Topic: resizing problem with background to posts in chrome

[hannah.love7]

I posted this on the SMF forum but no one has responded... i think it is complicated a little as i have simpleportal added on, so i thought i'd post here although i'm thinking it is a general CSS issue rather than simpleportal specifically, although adding simpleportal has made my problem worse... i wondered if anyone would be able to point me in the right direction..


I am running SMF2.0 RC3 with SimplePortal 3.3.3 and Celeste theme (very basic theme). Mods include reputation mod, simpleads, and a few others which shouldn't make any difference (youtube support, google analytics addon). I also had a little custom programming to add advertisements within posts.

For some time now, the background of the posts was not fitting the width of the screen, but was matching the width of the text inside the post - so it was only a problem when the topic had very short posts and therefore the background doesn't cover the width of the screen. When i installed simpleportal, i have the same problem again, apart from that the background of the posts matches the same width of my horizontal ads at the top of the page this time, and it is not effected at all by the length of the post. This is obviously a much bigger problem now as it occurs on every single posts page. Strange.

When i add blocks in simpleportal... a right block for instance, the block AND the post resize themselves to match the width of the ad at the top of the page too.

Can someone point me in the right direction of how to change this? I take it this is a CSS issue which should be easily fixed? THe problem is only happening in Google Chrome browser - everything looks great in other browsers. Also, the resizing is not an issue on the main forum page, only when viewing topic contents.

I added a couple of screenshots of my forum, one with a portal block added, and one with no blocks so you can see what i mean.

[AngelinaBelle]

Can you link to your post at simplemachines.org?
I think that, if you are having a Chrome-related CSS problem with SMF, it might be simplest to narrow it down WITHOUT SimplePortal, perhaps on a test forum (you can make a copy of your forum, use a new database, or at least a new db_prefix for your tables,...). Once this is sorted out, MAYBE this will take care of the SimplePortal problem as well. Or maybe there will be some additional SimplePortal-only issues. I'm thinking "one step at a time".
And, I am thinking that you are more likely to find more Chrome users at Simplemachines.org because you've simply got more users there. Maybe we can do something to help your topic capture the attention of the people most willing and able to help with your mystery.

[hannah.love7]

Hi,

Thanks for the helpful response .

I did now get some responses over at the SMF forum. My topic is here: http://www.simplemachines.org/community/index.php?topic=429167.0 and was actually resolved now although i believe the fix was more of a work-around than a resolution of the problem itself - but as long as it works for now that's all good.

Joker over on the SMF forum wrote something about tables which i didn't really understand and mentioned i should ask you guys here about it.... see the topic i link to above.

[AngelinaBelle]

There is also an error in the XHTML (check with the XHTML validator link at the bottom of the page). It has

Code: [Select]

<span id="reputation_menu" style="visibility: hidden; display: none;">
<div class="windowbg2">
A div should never go inside a span. That's just incorrect. It is possible that Chrome might be confused how to deal with this, even though it is not even inside the message body.

For now, I think I would go with the workaround supplied by joker.

If the problem returns later (which it might), I would still suggest trying to go after the "before SimplePortal" problem separately from the "after SimplePortal" problem.

If joker's solution causes problems for tables used elsewhere in your site, you might try the following in your index.css.
This would cause the table to be of width 100% ONLY when it is a direct child of an element with id main_content_section.

Code: [Select]

#main_content_section > table
{
width: 100%;
}


[hannah.love7]

Thank you!