Front Page forum posts in FF3

[Wivelrod]

Link to my site: http://www.order-of-the-rose-croix.com/forum/index.php
SMF version: 1.1.5
TP version: 0.9.8
Theme name and version: New Definition
Mods installed: Just Karma Applaud Only
Related Error messages: n/a

Hi there, hope someone can point me to a fix for the following problem.

With the recent release of Firefox 3, some of our portal users started to complain about the front page not looking so hot.

What is happening is that the images using the News posts on the front page, are not overflowing correctly.

See: http://i254.photobucket.com/albums/hh89/Thorgald/namnls2.jpg

For the time being, I've moved the right side bar items to the left. But you can still replicate the crux of the problem, by loading the web site in FF3, then reducing the browser width so that the pictures on the front page scroll off the edge of the browser. You'll notice that the text doesn't wrap to the browser edge.

I've investigated this, comparing the HTML that is rendered on the front page forum posts, against what is rendered when viewing the post in the forum itself. There is a difference. On the forum pages, the content of each post is marked with the class "post", which contains the css "Overflow:Auto". On the front page, the post content is not marked with this class.

Firefox 3 therefore must have changed how it overflows some content that isn't marked explicitly with an overflow style property.

So obviously,  the simplest solution is to change the Front Page forum post section to render the news item posts using the "post" css class.

However, not being familiar with PHP, I do not know where to do this. I've searched through the files looking to where I could alter what HTML is rendered on the Front Page, but currently I am stumped.

Can anyone tell me which file(s) I should be looking in to find the code that renders Front Page forum posts (as set up in the Front Page admin section), so I can add the correct css style to the HTML?

Thanks for any help on this matter.

[G6Cad]

Dont think we can help at this time as we still build for non beta browsers. 

[IchBin]

That could also be a theme dependent option. One thing I would suggest is that you download the firebug extensions for firefox. You can use this extension to highlight all the elements on a page to see which CSS elements are assigned. You can then edits those elements on the page live. The changes aren't saved to the files, but you can see how changes affect things, then once you find what you need to do you add the changes to your files.

[Wivelrod]

I need to know which file, and where with in it, I would need to change to effect a fix.

I know what my fix is (we even mocked up a static version of the page to test), I just need to know where in the code I need to go in order to implement it.

Unless its all compiled somewhere and thus I don't have access to the source code to change?

I'm not asking for support explicitly for Firefox 3, I'm asking to know where *I* can make a change myself to fix a problem that some users are experiencing

Again, in summary:

Where should I be looking to make a change to the "show forum posts" HTML that is rendered on the front page of the portal?

Thanks

[IchBin]

Had you done what I suggested you would realize that the fix MAY be in the style.css file which the firebug extension would show you....

[Ken.]

I can't add anything to the debate as to the file edits but I can tell you that the images you are displaying are way too large for the space that you are trying to use them in. If an image is more than 800x600px it should be in a page with little else than the image. Yours all seem to be larger in pixel size than that and the file size seems rather large as well with the first one being almost 400KB... so your page is likely to be over 1MB in size which means lots of load time/delays when someone tries to open the page.

The pixel size also adds to the break-out issue.
Maybe you should consider having a separate page for your images and have all other displays (like blocks) turned off on these image pages?

[Wivelrod]

Thanks for the advice, well intentioned I know, but it doesn't answer my query

I want to add a class to an element in the rendered HTML, not alter an existing class (the element we need to change uses an in-line style, not a css class, we wish to change this).

I might be able to come up with a change to apply the style where it's needed, but it will be messy. I don't like messy. And I can't be certain that I can come up with a CSS selector that would specifically only apply to the one HTML element I want.

The simplest change is to change the HTML at source. Can I do that?

I'm not looking for other peoples opinions on our site, images sizes - I just want an answer to the question.

Is it possible?
Yes, or no.
If so how?

Thanks.

[IchBin]

Yes its possible. By changing the code to make it work. How? Wouldn't know without looking at your site which I don't have time to do. Check out the TPortal.template.php file to find the code. Good luck.

[Smoky]

Can anyone tell me which file(s) I should be looking in to find the code that renders Front Page forum posts (as set up in the Front Page admin section), so I can add the correct css style to the HTML?

you might want to look into the admin> current theme and set a size for the images being posted, as this is a "image issue"

you can try ICH's suggestion, but, if the theme is set to show on a certain width, which it is.. if your images are large that what the theme is calling for, you will be "breaking the theme" ie: the demo you showed in the pic, or for smaller screen sizes, it will produce a "scroll effect" for those viewers..

albeit, you are a gaming site, but still, you should look into the "style.css" file and/or the index.template.php ( i havent messed with the theme, NEWDEF, so hard to say..

ps. this is NOT an oppinion.. but good luck with your site