Menu
I have created this piece of code.
<a href="#">
<!-- BEGIN #btnBox .btnBox -->
<div id="btnBox2" class="btnBox">
<div class="btnleft"></div> <!-- BEGIN & END .btnleft -->
<!-- BEGIN .btncenter -->
<div class="btncenter">
<div id="btnText2" class="btnText">Want more? - check out my recent work</div>
</div>
<!-- END .btncenter -->
<div class="btnright"></div> <!-- BEGIN & END .btnright -->
</div>
<!-- END #btnBox .btnBox -->
</a>
And when I validate the code under W3 HTML validation, it's giving me an error:
Line 163, Column 41: document type does not allow element "DIV" here; missing one of "OBJECT", "MAP", "BUTTON" start-tag
I am using
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
813
The valid HTML tag must satisfy the following conditions: It should start with an opening tag (<). It should be followed by a double quotes string or single quotes string. It should not allow one double quotes string, one single quotes string or a closing tag (>) without single or double quotes enclosed.
There is no name attribute for div elements. If you want to uniquely identify one, then use id . If you want to mark one as a member of a group, then use class . The only place you can use a name attribute (that hasn't been deprecated) is on form controls ( input , select , textarea and button ).
If you need to 'name' a div in order to address it from javascript or otherwise uniquely identify it on a page, you can use the id attribute. That said, most modern browsers will handle a name attribute on a div with no issues but it does not conform to HTML standards.
Divs are block level elements - they should not be included within Anchor tags.
158
A division <div> is a block level element while an anchor <a> is an inline element. From the w3c web site:
Generally, block-level elements may contain inline elements and other block-level elements. Generally, inline elements may contain only data and other inline elements. Inherent in this structural distinction is the idea that block elements create "larger" structures than inline elements.
Chances are you're using divisions because you need block-level behavior, like width and height.
Without changing your DOCTYPE, you can use the CSS property display to make <span> elements behave like <div> elements:
<a href="#" class="forMuzammil">
<!-- BEGIN #btnBox .btnBox -->
<span id="btnBox2" class="btnBox">
<span class="btnleft"></span> <!-- BEGIN & END .btnleft -->
<!-- BEGIN .btncenter -->
<span class="btncenter">
<span id="btnText2" class="btnText">Want more? - check out my recent work</span>
<!-- END .btncenter -->
</span>
<span class="btnright"></span> <!-- BEGIN & END .btnright -->
<!-- END #btnBox .btnBox -->
</span>
</a>
a.forMuzammil {
display:block;
}
a.forMuzammil span {
display:block;
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
