Why Does the <P> tag creates a black background here? and how do I get rid from the border?

Question

I'm trying to create some colorbox element, and I can't figure out why does the

tag creates a black background here? and how do I get rid out of the external black border? (tried to modify the CSS with no success)

This is the Fiddle with all relevant code

Answer 1

The black border come from this css:

#cboxContent{margin-top:32px; overflow:visible; background:#000;}
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{background:#000; padding:1px;}
#cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}
#cboxLoadingOverlay{background:#000;}

Try this instead;

#cboxContent{margin-top:32px; overflow:visible; }
.cboxIframe{background:#fff;}
#cboxError{padding:50px; border:1px solid #ccc;}
#cboxLoadedContent{ padding:1px;}
#cboxLoadingGraphic{background:url(images/loading.gif) no-repeat center center;}

Fiddle: demo