Nasif Md. Tanjim
Nasif Md. Tanjim

Reputation: 3972

Should we include the Bootstrap container class inside or outside of HTML semantic class article?

Should we include the Bootstrap container class inside or outside of HTML semantic class <article>?

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>html</title>
        <link rel="stylesheet" href="css/style.css">
        <link rel="author" href="humans.txt">
    </head>
    <body>
        <div class="container">
            <article>
                ...
            </article>
        </div>
        <script src="js/main.js"></script>
    </body>
</html>

Or, this is recommended?

<!doctype html>
<html>
    <head>
        <meta charset="utf-8">
        <meta name="description" content="">
        <meta name="viewport" content="width=device-width, initial-scale=1">
        <title>html</title>
        <link rel="stylesheet" href="css/style.css">
        <link rel="author" href="humans.txt">
    </head>
    <body>
        <article>
            <div class="container">
                ...
            </div>
        </article>
        <script src="js/main.js"></script>
    </body>
</html>

Upvotes: 6

Views: 2017

Answers (2)

Mimetix
Mimetix

Reputation: 272

As said in the HTML5 Specs:

The article element represents a complete, or self-contained, composition in a document, page, application, or site and that is, in principle, independently distributable or reusable, e.g. in syndication. This could be a forum post, a magazine or newspaper article, a blog entry, a user-submitted comment, an interactive widget or gadget, or any other independent item of content.

AFAIK the "container" class does not give your code any kind of semantic markup. You can have articles inside articles, containers inside containers, articles inside containers, or containers inside articles. It just depends on what you want to show.

You can also have a look to this.

Upvotes: 0

John Reid
John Reid

Reputation: 1185

Bootstrap requires a containing element to wrap site contents and house our grid system

http://getbootstrap.com/css/

With that in mind - you should keep the container on the outside. You can use grids to house the articles from that point on.

Upvotes: 1

Related Questions