[RESOLVED] Displaying HTML Forum Messages (CSS)

[ixalmida]

I have a simple message forum which allows users to post HTML-encoded messages. Currently, I am not filtering the HTML tags they can use, so it is possible for someone to create their own DIV and mess up my page styling. Most users will simply use the Javascript "rich text editor", but I'd like to protect my style sheet anyway.

Is there some way to isolate a CSS DIV so it can't affect the rest of the page, or do I just need to resort to filtering the tags using PHP?

The HTML currently looks like this:

<div class="msg_content">
  <p class="subject"><?php echo subject; ?></p>
  <?php echo message; ?>
</div>

Also, I'd like the message portion not to inherit some of the CSS of the parent class. Is there a way to prevent all inheritance for a particular DIV, or do I have to set "inherit: none" for each HTML tag?

[johanafm]

If you don't do some kind of filtering, the only way to prevent them from positioning any element wherever they want to, is by keeping user content in its own frame.

But, for safety reasons, as soon as you allow html input you have to create a filter, (else you could just have used htmlentities instead). And do go with a whitelist filter. That is, keep only what you define as ok yourself. Then you can either just remove everything else, or pass it through htmlentities.

Also, doing this with javascript is not recommended. You have to deal with filtering server side.

[ixalmida]

Thanks. I'll work on a whitelist filter.

Any answer for the second question about general non-interitance? Can it be done, or do I have to turn it off for each element?

[johanafm]

Most, but not all, elements always inherit styles, unless specifically overridden for any given element.

Example of non-inherited properties are margin and border.

[ixalmida]

Thank you for answering all my questions. 🙂