Search code examples
htmlcssbackground

Is there a way to use use text as the background with CSS?


I would like to use dynamic text as background of certain elements in my tag. Because of this, I can use images (dynamic text). How do I do it with just CSS or JavaScript?


Solution

  • You can have an absolutely positioned element inside of your relative positioned element:

    #container {
       position: relative;
    }
    
    #background {
       position: absolute;
       top: 0;
       left: 0;
       bottom: 0;
       right: 0;
       z-index: -1;
       overflow: hidden;
    }
    <div id="container">
        <div id="background">
        Text to have as background
        </div>
        Normal contents
    </div>

    Here's an example of it.