I am trying to follow the xhtml 1.0 strict standard as I am creating my website. Right now, validator.w3.org validates my document as valid, following the XHTML 1.0 Strict standard. Here is a code-example:
<div style="color:#f00"><div style="color:#00f" />Text should be red and not blue</div>
Unfortunately, Firefox, Chrome and Internet Explorer parses the document incorrectly: They all seem to ignore the closing statement of my self-closing tags (mostly <div />, <li /> and some other tags), thus rendering the site incorrectly, with the text being blue. if i replace <div /> tags with <div></div>, it all looks fine. I read about it and according to xml document, including xhtml, can be self-closed
Here is the important header information that comes with the document:
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
<head>
<meta http-equiv="Content-Type" content="application/xhtml+xml; charset=utf-8" />
Apache2 itself still sends Content-Type text/html, as I haven't figured out yet how to overwrite the .php mime type, though the info in <head> should overrule that either way.
How can I use self-closing tags such as <div /> with them being parsed correctly by common browsers?