Quote:
Originally Posted by roland1
I'm just looking at the SIGIL wiki html lesson page to further educate myself as to what is possible/impossible with ebooks.
Does anyone have a comment about using <div> tags? I never used them in my ebook because I didn't think nesting was necessary for what I do. But I see the selector being used with image/caption combos. Any thoughts — pros or cons about their usage?
|
Reverting back to the semantics reasoning... If it has a specific tag: paragraph, heading, blockquote, list, etc. then you should be using those. The <div> is used pretty much for everything else... images, poetry, or, I like to use them when there is a group of items, usually paragraphs, that I like to style separately without having to define a class on every paragraph.
For example, instead of this:
Code:
p {normal paragraph styling}
p.different {different paragraph styling}
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p class="different">This is a different style of paragraph.</p>
<p class="different">This is a different style of paragraph.</p>
<p class="different">This is a different style of paragraph.</p>
<p class="different">This is a different style of paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
You could use:
Code:
p {normal paragraph styling}
div.different p {different paragraph styling}
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<div class="different">
<p>This is a different style of paragraph.</p>
<p>This is a different style of paragraph.</p>
<p>This is a different style of paragraph.</p>
<p>This is a different style of paragraph.</p>
</div>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
<p>This is a normal paragraph.</p>
It makes the code much cleaner and IMO easier to keep track of what you are trying to accomplish.
I'm sure there are other uses/techniques people have around here.
One thing that really drives me nuts is when I see people use the <div> to replace an item that has it's own, semantically correct, tag. For example:
Code:
<div class="para">This is a normal paragraph.</div>
<div class="para">This is a normal paragraph.</div>
<div class="para">This is a normal paragraph.</div>
<div class="para">This is a normal paragraph.</div>
<div class="para">This is a normal paragraph.</div>
<div class="para">This is a normal paragraph.</div>
<div class="para">This is a normal paragraph.</div>
<div class="para">This is a normal paragraph.</div>
<div class="para">This is a normal paragraph.</div>
forever...