Space around div with background image
I am trying to create a frame that will contain a dynamic amount of text. it has rounded corners, so 3 divs are created: top, body and bottom. the body will contain the content, and the top and bottom will only display the corresponding frame images. all this can be seen here:
http://www.m-challenge.com/nimrod/modular_frame.php
problem: there is space, top and bottom divs and middle. please take a look and any input will be greatly appreciated. To have a good day: -)
a source to share
Your problem is the tag p
has some top / bottom margin. Give it a headroom of 0 to fix it. The same would apply if you put tags h#
, ul
and similar tags in the field.
Also, can I recommend you not to spend so much time on rounded courses this way and just use a CSS3 border radius? I know it's not fully supported yet, but you have support for most browsers other than IE, and IE users just get a graceful return to the square box. Just a suggestion
a source to share
I think you should reset margins and paddings first: http://meyerweb.com/eric/tools/css/reset/
then apply the correct values depending on the effect you want to achieve.
a source to share