How could you add a background watermark to the content part of a page? Adding a logo/watermark seems hard to do for me. I can't get it the size I want.


Add some markup to your page for the watermark and some css to style it as a watermark.


Here is the markup I've added to this page:

<div id="background-container">
    <div id="background">
    Text to have as background
    Normal contents

and here is the css i've added:

#background-container {
    position: relative;

#background {
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    z-index: 37;
    color: red;
    transform: rotate(45deg);
    font-size: 92px;

Here is the stackoverflow reference: