[Løst] Margin + <section> i html5/css

[Stian_]

Hei. Jeg faar ikke stilt paa margin for <section> tag i mitt html dokument. padding fungerer fint.

 

Jeg oensker at sidebar/section skal 10px ned (margin) - for a vaere paa linje med posts/divs paa venstre side.

 

Lurer paa hvor forskjellen margin/padding paa de 10px er.

 

 

HTML kode:

       <div id="wrapper">

           <div id="posts"><article>....</article>
           </div>
           <!-- end div id="posts" -->
           <section>
               <p>about goof productions (..)</p>
           </section>
       </div>
       <!-- end div id="wrapper" -->

 

 

Koden er inne i div id=wrapper. Oensker at den skal 10px ned, paa linje med div id=post.

 

css kode:

/* sidebar */
section {
       display: table-cell;
       background: rgba(180, 220, 80, 0.4);
       border-radius: 20px;
       padding: 20px;
       margin: 30px 30px 30px 30px;
       width: 180px;
}
section p {
}

 

css fil: http://goofproductions.com/sidebar.css

html: http://goofproductio...php?css=sidebar

 

Dette kan loeses med

article:first-child {
margin-top: 0;
}
article:last-child {
margin-bottom: 0;
}

...men det vil ikke vaere saa fint

[Stian_]

Feilen laa i article som hadde margin: 1opx...

 

Hei. Jeg faar ikke stilt paa margin for <section> tag i mitt html dokument. padding fungerer fint.

 

Jeg oensker at sidebar/section skal 10px ned (margin) - for a vaere paa linje med posts/divs paa venstre side.

 

Lurer paa hvor forskjellen margin/padding paa de 10px er.

 

 

HTML kode:

       <div id="wrapper">

           <div id="posts"><article>....</article>
           </div>
           <!-- end div id="posts" -->
           <section>
               <p>about goof productions (..)</p>
           </section>
       </div>
       <!-- end div id="wrapper" -->

 

 

Koden er inne i div id=wrapper. Oensker at den skal 10px ned, paa linje med div id=post.

 

css kode:

/* sidebar */
section {
       display: table-cell;
       background: rgba(180, 220, 80, 0.4);
       border-radius: 20px;
       padding: 20px;
       margin: 30px 30px 30px 30px;
       width: 180px;
}
section p {
}

 

css fil: http://goofproductions.com/sidebar.css

html: http://goofproductio...php?css=sidebar

 

Dette kan loeses med

article:first-child {
margin-top: 0;
}
article:last-child {
margin-bottom: 0;
}

...men det vil ikke vaere saa fint