|
A common trick in CSS design is to set a background image in the body tag for a
site that contains a lot of the graphic elements of a site. This is often used
to create colored columns and bars in CSS only design. For example:
body {
background: url("myimage.gif");
}
When you do this in SharePoint, the background image will also appear in the
Rich Text Editor used in the Content Editor Web Part.
You can fix this issue pretty easily. Add a DIV tag around your page contents,
and set the background for the DIV to the image that you need to use. Then, in
your CSS code, specify both BODY and the class/ID for the DIV:
body .MyDiv {
background: url("myimage.gif");
}
Notice the space between body and .MyDiv! This is a contextual selector, only
the tag with the class name of MyDiv in the Body tag will be affected.
Now the image will appear in your page, but not in the Rich Text Editor.
Some notes... if you add a class or ID name to the BODY tag and reflect that in
your CSS, it will not fix the issue. If you just move the image to a DIV
wrapper and specify the image, it will not fix the issue. It is the combination
of the image being in a wrapper, and body + the wrapper being specified in the
CSS file that fixes the problem.
|