Support » Fixing WordPress » Class and Div in css

  • can i call both class in div in a css file?
    example

    <div id="main">
        <div class="wrapper">
            [...]
        </div>
    </div>

    and in the css

    #main .wrapper{
        width:100px;
    }

    is this okay to use?

Viewing 7 replies - 1 through 7 (of 7 total)
  • Yes this is okay to use in this way.

    Thread Starter intern101

    (@intern101)

    @extech
    oh that’s cool thank you .. by the way there are other tags inside the #main… do i have to list them down in the css?

    #main .wrapper
    .othertag #div2
    .othertag2 .othertag3{
        width: 100%;
    }

    or just the chosen ones? i am trying its responsiveness
    thank you

    You can list them down as many as you want but in my opinion you are making it complicated.

    You can simply target the divs by using classes.

    It will not effect your responsiveness. Because can re-write the css in the media screen.

    Thread Starter intern101

    (@intern101)

    The #main is actually a default so if I changed it lots of element in css will be affected and the other tags are plugins or wordpress defaults.
    I guess ill just test them out…

    Thank you sir

    More common usage would be:

    <div id="main" class="wrapper">
            [...]
    </div>

    The important thing is that an ID is unique, there is only one of them in the page.

    It’s best to give big sections an id so you can organize the css better:

    <div id="header" class="wrapper">
            <div class="3col">[...]</div>
            <div class="3col">[...]</div>
            <div class="3col">[...]</div>
    </div>
    <div id="main" class="wrapper">
            <div class="3col">[...]</div>
            <div class="3col">[...]</div>
            <div class="3col">[...]</div>
    </div>
    <div id="footer" class="wrapper">
            <div class="3col">[...]</div>
            <div class="3col">[...]</div>
            <div class="3col">[...]</div>
    </div>

    so then you can set a rule for all .3col, and give individual rules by id

    .wrapper {max-width:1000px}
    .3col {width: 32%}
    #header .3col {height:300px}
    #main .3col {height: 400px}
    #footer .3col {height: 100px}

    Thread Starter intern101

    (@intern101)

    @extech, @rossmitchell thank you sirs
    @wpmonty, sir the divs are nested.. but ill keep this idea

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Class and Div in css’ is closed to new replies.