0

am totally new in HTML and Im wondering about the wrapper thing. Can you tell me why there is first "div id" and then in the subcode "div class="wrapper" ? Could I replace the id with class to have the same effect, and vice versa? I mean why is it that first comes and then ?

    <header>
        <div class="Wrapper">
            <h1></h1>
            <nav></nav>
        </div>
    </header>


    <div **id**="heroImage">
        <div **class**="Wrapper">
            <h2></h2>
            <a></a>
        </div>
    </div>


    <div id="features">
        <ul>
            <li></li>
            <li></li>
            <li></li>
        </ul>
    </div>


    <div id="primaryContent">
        <article></article>
    </div>


    <div id="secondaryContent">
        <article></article>
        <article></article>
    </div>
Richi888
  • 49
  • 1
  • 8
  • 1
    `Id` attributes are to be unique in a page - `class` attributes can be re-used many times per page - their order does not matter. In your HTML, the `wrapper` class likely contains some CSS elements that could be applied to other `
    ` elements as well - the `id` are some what unique (because of the content?) and are to be decorated separately in the CSS
     – blurfus May 05 '16 at 22:57
  • Possible duplicate of [Difference between div id versus div class](http://stackoverflow.com/questions/544010/difference-between-div-id-versus-div-class) – Nirpendra Patel May 05 '16 at 23:21

4 Answers4

2

You have IDs when you want to refer to a specific div(or element) unique, for example, heroImage. That means that this ID can only refer to this div, and not to others so the properties that you add to #heroImage in your CSS (never inline), will be applied only for this div.

You are using a class named Wrapper because you are using it in more than one div. You can use this class in all the divs that you want to have the same properties.

Notice the differences about ID and class. ID just for one element, class for all the elements you want.

Francisco Romero
  • 12,787
  • 22
  • 92
  • 167
2

Id's are unique and classes may be in several elements, something that can help you is the following link that explain that: "https://css-tricks.com/the-difference-between-id-and-class/"

in Css or javascript/Jquery for example if you want access to some specific Item of the dom, is where id's are really important.

you can use classes instead of Id's but I think that it is more complecated because if you want modify for example the backgroud of a div with jquery you need to be sure that any other item in the dom has the same class.

Dlanor
  • 266
  • 2
  • 13
1

Can you tell me why there is first "div id" and then in the subcode "div class="wrapper" ?

It is up to your CSS, it is no matter who come first actually. You use ID if it is unique and need to be a different style from other. You use Class if it will be same style with other (the other one that have the same style use the same class)

Could I replace the id with class to have the same effect, and vice versa? I mean why is it that first comes and then ?

As i answer above, there is no matter who come first. Assume that ID you want to replace with Class as MyID and the Class is MyClass If the element (ID : MyID) can have the same style with the MyClass. It is better if you replace it with MyClass.

Johan Surya
  • 23
  • 7
1

Do you see how your question has up and down arrows on the left and the text for your question on the right? All these items are being "wrapped" under a single invisible box. The buttons are also wrapped into another invisible box within the parent wrapper.

You can create an element (image) and give it class="vote-button". In your CSS you can they apply the color "gray" to any button with the class "vote-button". Let's say you want to apply a unique property on a single button: e.g. you want to change the orientation for one button to point up and the other to point down. You can do this by giving each button an id: id="upvoteButton" and id="downvoteButton".

Arman Peiravi
  • 1,079
  • 9
  • 12