Using background-image with DOCTYPE

StackOverflow https://stackoverflow.com/questions/23622130

  •  21-07-2023
  •  | 
  •  

Вопрос

I have a .asp page and I'm having problem showing the image when I place a DOCTYPE on top of the ASP page. If I delete the DOCTYPE on top then the image will show up. Can anyone please help me figure out how to show the image withour deleting the DOCTYPE on top? Please see coding below:

DOCTYPE:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

HTML:

<table cellpadding="0" cellspacing="0" border="0">
    <tr>
        <td style="width:200px"><span id="ImgHeader"></span></td>
    </tr>
</table>

CSS:

#ImgHeader
{
    background-image:url(img/header.jpg);
    width:200px;
    height:35px;
}
Это было полезно?

Решение

As <span> is an inline element, you cannot apply height to it.

You should change <span> into <div>, which is a block element.

<td style="width:200px"><div id="ImgHeader"></div></td>

or apply the CSS selector to <td> if applicable:

<td id="ImgHeader">&nbsp;</td>

Last, it's time to change to a modern HTML5 DOCTYPE:

<!DOCTYPE html>

Important: never remove the DOCTYPE.

p.s. if you are worried about old browser support of HTML5 DOCTYPE, read this. In short, old browser supports this DOCTYPE too (except NS6, which I believe nobody is using it)

Лицензировано под: CC-BY-SA с атрибуция
Не связан с StackOverflow
scroll top