Advantage of a <div> wrapping the page content

what · 03-09-2021, 03:11 AM

In many ePubs that I own, the headers (<h1> etc.) and paragraphs (<p>) of the page content are wrapped in an division element (<div>), e.g.:

Code:

<html>
...
<body>
    <div>
        <h1>Chapter Heading</h1>
        <p>The text of the chapter.</p>
    </div>
</body>
</html>

Sometimes the <body> and <div> are styled, usually defining margins, sometimes they are both unstyled.

What are the advantages and disadvantages of wrapping my page content in a <div>, and (why) should I do it?

Jellby · 03-09-2021, 04:29 AM

The only advantage I can think of is that a <div> allows you to have inline elements at the same level as the main block elements. In principle things like <img> or <span> are by default inline elements (even if they are styled with display:block), and are not allowed (at least in XHTML 1.1) as direct children of <body>, they must be inside some block element, and the wrapping <div> does it.

I wouldn't use it unless I need that trick for some particular case.

phillipgessert · 03-09-2021, 02:41 PM

Some tools add divs like that by default. I believe pandoc does, for example. So it's not always something done intentionally to achieve a result.

JSWolf · 03-11-2021, 12:23 PM

I use Diaps Editing Toolbag plugin (for the Calibre editor) to remove such empty divs.They don't do a thing.

03-09-2021, 03:11 AM	#1
what Enthusiast Posts: 28 Karma: 10 Join Date: Mar 2021 Device: none	Advantage of a <div> wrapping the page content In many ePubs that I own, the headers (<h1> etc.) and paragraphs (<p>) of the page content are wrapped in an division element (<div>), e.g.: Code: <html> ... <body> <div> <h1>Chapter Heading</h1> <p>The text of the chapter.</p> </div> </body> </html> Sometimes the <body> and <div> are styled, usually defining margins, sometimes they are both unstyled. What are the advantages and disadvantages of wrapping my page content in a <div>, and (why) should I do it?

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Content servers web page in Chrome	RobertBB	Server	2	10-27-2019 04:33 AM
Home page of the content server.	Laval	Related Tools	1	02-23-2018 11:29 PM
control div box, page breaks and margins?	Lancelot	ePub	4	09-21-2013 05:38 PM
element 'a' is not allowed for content model div	JoanneM	Workshop	6	11-23-2011 12:12 AM
iLiad Page Indicator for the Content Lister	Michele L.M.	iRex Developer's Corner	16	12-28-2008 09:43 AM

03-09-2021, 04:29 AM	#2
Jellby frumious Bandersnatch Posts: 7,571 Karma: 20150435 Join Date: Jan 2008 Location: Spaniard in Sweden Device: Cybook Orizon, Kobo Aura	The only advantage I can think of is that a <div> allows you to have inline elements at the same level as the main block elements. In principle things like <img> or <span> are by default inline elements (even if they are styled with display:block), and are not allowed (at least in XHTML 1.1) as direct children of <body>, they must be inside some block element, and the wrapping <div> does it. I wouldn't use it unless I need that trick for some particular case.

03-09-2021, 02:41 PM	#3
phillipgessert Addict Posts: 324 Karma: 3200000 Join Date: Oct 2015 Location: Madison, WI Device: Kindle 5th Gen	Some tools add divs like that by default. I believe pandoc does, for example. So it's not always something done intentionally to achieve a result.

03-11-2021, 12:23 PM	#4
JSWolf Resident Curmudgeon Posts: 80,789 Karma: 150249619 Join Date: Nov 2006 Location: Roslindale, Massachusetts Device: Kobo Libra 2, Kobo Aura H2O, PRS-650, PRS-T1, nook STR, PW3	I use Diaps Editing Toolbag plugin (for the Calibre editor) to remove such empty divs.They don't do a thing.

Advert