Question

I have a dynamic website with html editors for creating article content, however for some reason the p/div tags generated by the html editor are screwy on the front pages. I’m assuming this is because of css declarations from my overall website.

Here is a quick example:

<div class="custom_html_block"> 
    <div align="top"> 
        <p> test test test test test test test test test</p> 
        <p> test test test test test test test test test</p> 
        <p> test test test test test test test test test</p> 
    </div>
</div> 

What css would I need to make all elements inside the look/appear like they would on a blank html page? Can someone help me out with that?

Thanks!

Answer 1

It sounds like the default styles of your <p> tags have some styles that are being inherited by existing styles. The way to avoid this is to be very specific about these tags so you can control them individually

.custom_html_block { padding:15px 15px 0; }
.custom_html_block p { padding-bottom:15px; ) 

I would use firebug to find out what additional styles you need to specify in order to create a more “default” look