13

I currently have a div on my page that I have given a background image. This div does not have any content and so it does not display on my page, if I add any content it displays. I would like it display even without content because I want that background image to show up as well as I would like to assign some hover/click events to it.

Is there any way to force the div to display?

Collin Estes
  • 5,577
  • 7
  • 51
  • 71

5 Answers5

17

You need to specify a size:

<div style="width: 100px; height: 100px"></div>

You can set the size to the dimensions of your background image, or any other values you desire.

George Cummins
  • 28,485
  • 8
  • 71
  • 90
3

Add a height and a width to the div. You may want to use min-height and min-width and set them equal to the size of your background image.

Adding an empty comment will help browsers that strip empty tags.

Jared
  • 12,406
  • 1
  • 35
  • 39
3

You need to specify width and height of that div using css (or min-width and min-height)

AR.
  • 1,935
  • 1
  • 11
  • 14
2

Add height and width to it.

Jsfiddle: http://jsfiddle.net/GFTtY/

kei
  • 20,157
  • 2
  • 35
  • 62
0

Adding an empty //content// worked for me. Setting width/height or min-width/min-height didn't force the background image to appear. (Chrome 51 on Win8)

wintifrosch
  • 1