Ik ben bezig met coderen van een website en heb 2 rows. ik wil van de eerste geen padding, wel voor de rest van de sections met de class "row".
Om dit te bereiken heb ik de css3 selector :first-child {} nodig. Maar ik zie geen resultaat. Waar kan dit aan liggen? Hieronder de code + css
<!-- Start container website -->
<div class="container_12">
<header class="grid_12 header-top">
<a href="#" id="logo"><img src="images/logo.png" alt="DesignStyle Logo" /></a>
<nav id="primary-navwrapper">
<ul id="listnav">
<li><a href="index.html" id="current">Home</a></li>
<li><a href="pages/portfolio.html">Portfolio</a></li>
<li><a href="pages/blog.html">Blog</a></li>
<li><a href="pages/service.html">Service</a></li>
<li><a href="pages/designstyle.html">DesignStyle</a></li>
<li><a href="pages/contact.php">Contact</a></li>
</ul>
</nav>
</header>
<section class="grid_12 row">
<h2 id="message">
Hello! Welcome to the showcase of graphic and web designer / developer Casper Biemans.
<br>
We’re DesignStyle, a creative agency based in the Netherlands.
</h2><!-- End #message h2 -->
<div class="sliderbox">
<img src="images/slides/designstyle-2.jpg" alt="DesignStyle" />
</div><!-- End .sliderbox -->
</section><!-- End section.grid_12 row -->
<section class="row">
<ul class="featuredbox">
<li class="grid_4">
<h3>What we do</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus quis ante eros. Aliquam in eros mauris, sed adipiscing neque. Donec tristique
bibendum vulputate. Vivamus aliquam semper sapien, quis aliquet purus rutrum id.
<br>
<br>
Vestibulum tincidunt gravida lacinia. Nulla facilisi. Suspendisse ullamcorper, est eget dignissim tempor, eros magna lacinia risus, fermentum aliquam
ante ipsum ut purus.
</p>
</li><!-- End li.grid_4 -->
<li class="grid_4">
<h3>About</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus quis ante eros. Aliquam in eros mauris, sed adipiscing neque.
Donec tristique bibendum vulputate. Vivamus aliquam semper sapien, quis aliquet purus rutrum id.
<br>
<br>
Vestibulum tincidunt gravida lacinia. Nulla facilisi. Suspendisse ullamcorper, est eget dignissim tempor, eros magna lacinia risus,
fermentum aliquam ante ipsum ut purus.
</p>
</li><!-- End li.grid_4 -->
<li class="grid_4">
<h3>Contact</h3>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Phasellus quis ante eros. Aliquam in eros mauris, sed adipiscing neque.
Donec tristique bibendum vulputate. Vivamus aliquam semper sapien, quis aliquet purus rutrum id.
<br>
<br>
Vestibulum tincidunt gravida lacinia. Nulla facilisi. Suspendisse ullamcorper, est eget dignissim tempor, eros magna lacinia risus,
fermentum aliquam ante ipsum ut purus.
</p>
</li><!-- End li.grid_4 -->
</ul><!-- End ul -->
</section><!-- End section.row -->
</div><!-- End .container -->
/* Setup rows */
.row {
width: 100%; /* Width of #container */
max-width: 960px;
margin: 0 auto;
padding: 20px 0 0 0;
float: left;
border: 10px solid #333;
}
.row:first-child {
width: 100%; /* Width of #container */
max-width: 960px;
margin: 0 auto;
padding: 0;
float: left;
}