I want to select the .aboutUsItem inside the #aboutUs. What did I do wrong ? This is my code:
#aboutUs .aboutUsItem {
background-color: #e18686;
padding: 30px;
text-align: left;
min-height: 362px;
margin-top: 40px;
border-radius: 65px 18px 65px 18px;
}
#aboutUsItems .container .row .col-md-3 >.aboutUsItem:nth-child(2) {
border-radius: 0px;
}<section id="aboutUs">
<div class="container">
<div class="row">
<div class="col-md-3 col-lg-3">
<div class="aboutUsItem redBg">
<p><i class="fa fa-check"></i></p>
<p><strong>7/24 Teknik Destek</strong></p>
<p>
Sadece Ticimax'ta olan 7/24
telefon ve ticket desteği ile
kesintisiz hizmet alın. Ticimax
Akademi'de her hafta ücretsiz
sınıf ve uygulamalı eğitimlerimize katılın.
</p>
</div>
</div>
<div class="col-md-3 col-lg-3">
<div class="aboutUsItem purpleBg">
<p><i class="fa fa-check"></i></p>
<p><strong>7/24 Teknik Destek</strong></p>
<p>
Sadece Ticimax'ta olan 7/24
telefon ve ticket desteği ile
kesintisiz hizmet alın. Ticimax
Akademi'de her hafta ücretsiz
sınıf ve uygulamalı eğitimlerimize katılın.
</p>
</div>
</div>
<div class="col-md-3 col-lg-3">
<div class="aboutUsItem greenBg">
<p><i class="fa fa-check"></i></p>
<p><strong>7/24 Teknik Destek</strong></p>
<p>
Sadece Ticimax'ta olan 7/24
telefon ve ticket desteği ile
kesintisiz hizmet alın. Ticimax
Akademi'de her hafta ücretsiz
sınıf ve uygulamalı eğitimlerimize katılın.
</p>
</div>
</div>
<div class="col-md-3 col-lg-3">
<div class="aboutUsItem orangeBg">
<p><i class="fa fa-check"></i></p>
<p><strong>7/24 Teknik Destek</strong></p>
<p>
Sadece Ticimax'ta olan 7/24
telefon ve ticket desteği ile
kesintisiz hizmet alın. Ticimax
Akademi'de her hafta ücretsiz
sınıf ve uygulamalı eğitimlerimize katılın.
</p>
</div>
</div>
</div>
</div>
</section>>Solution :
You are making two mistakes :
-
In your second css selection, it should be
#aboutUsinstead of#aboutUsItems. -
You would wanna select the second
.col-md-3and change its.aboutUsItem.
#aboutUs .aboutUsItem {
background-color: #e18686;
padding: 30px;
text-align: left;
min-height: 362px;
margin-top: 40px;
border-radius: 65px 18px 65px 18px;
}
#aboutUs .container .row .col-md-3:nth-child(2) .aboutUsItem {
border-radius: 0px;
}<section id="aboutUs">
<div class="container">
<div class="row">
<div class="col-md-3 col-lg-3">
<div class="aboutUsItem redBg">
<p><i class="fa fa-check"></i></p>
<p><strong>7/24 Teknik Destek</strong></p>
<p>
Sadece Ticimax'ta olan 7/24
telefon ve ticket desteği ile
kesintisiz hizmet alın. Ticimax
Akademi'de her hafta ücretsiz
sınıf ve uygulamalı eğitimlerimize katılın.
</p>
</div>
</div>
<div class="col-md-3 col-lg-3">
<div class="aboutUsItem purpleBg">
<p><i class="fa fa-check"></i></p>
<p><strong>7/24 Teknik Destek</strong></p>
<p>
Sadece Ticimax'ta olan 7/24
telefon ve ticket desteği ile
kesintisiz hizmet alın. Ticimax
Akademi'de her hafta ücretsiz
sınıf ve uygulamalı eğitimlerimize katılın.
</p>
</div>
</div>
<div class="col-md-3 col-lg-3">
<div class="aboutUsItem greenBg">
<p><i class="fa fa-check"></i></p>
<p><strong>7/24 Teknik Destek</strong></p>
<p>
Sadece Ticimax'ta olan 7/24
telefon ve ticket desteği ile
kesintisiz hizmet alın. Ticimax
Akademi'de her hafta ücretsiz
sınıf ve uygulamalı eğitimlerimize katılın.
</p>
</div>
</div>
<div class="col-md-3 col-lg-3">
<div class="aboutUsItem orangeBg">
<p><i class="fa fa-check"></i></p>
<p><strong>7/24 Teknik Destek</strong></p>
<p>
Sadece Ticimax'ta olan 7/24
telefon ve ticket desteği ile
kesintisiz hizmet alın. Ticimax
Akademi'de her hafta ücretsiz
sınıf ve uygulamalı eğitimlerimize katılın.
</p>
</div>
</div>
</div>
</div>
</section>