can you use an image background to define the dimensions of a div?

[Darkmatter5]

The topic says it all.  Can I create an image and use it as a background in a div and have the div use the size of that image as the dimensions for the div?

 

If not can I insert an image into the div and have all the text and content of the div display on top of the image?  Basically putting the image under all the content, but NOT as the background, but as an actual image to force the div to use the images size as its dimensions?

[wildteen88]

You can only have text over background images. Why do you want to the div to automatically adjust to your background image? Cant you hard code the width/height of the div?

 

#my_div {
    background-image: ('my_background.gif');
    background-repeat: no-repeat;
    width: 700px;
    height: 100px;
}

[ifubad]

Q&A 2: not naturally. But you can try the following

 

    span {
        position: relative;
        color: #FF0000;
        top: -50px;
        left: -50px;
    }

    <div>
        <img src="image.jpg" height="100px"><span>Text</span>
    </div>

[dropfaith]

odd yea image size isnt flexible so i would just manually set the div size.  to the size of the image

 

#my_div {

    background-image: ('my_background.gif');

    background-repeat: no-repeat;

    width: IMAGE WIDTH;

    height: IMAGE HEIGHT;

}