CODEWITHSUNDEEP
htmlcss
Teddy13
Teddy13

Reputation: 3854

Cannot select child p tag CSS

I am using Bootstrap 3 for my new website and for the life of me I cannot select the p tag in the example below. I have tried everything I can think of and I have been stuck on this problem for the last 3 hours (sad I know).

I have tried the following below to name a few examples

 .p 
 body > section > .container > .row > .col-sm-5 > p

and then (for each one I tried). 

 { 
 color: red;
 }

As well I have tried to give the tag a class name and then call that class or ID directly... still nothing. I have tried every combo I can think of.

Can anyone tell me how to select the p element so I can change the text colour? The following is taken using firebug in firefox, again I am looking for the p tag.

enter image description here

EDIT

html code as requested

<section id="slider" class="bg-color np">
    <div class="container">
        <div class="row item">
            <div class="col-sm-5">
                <p id="test">Our product is one of a kind!</p> <!-- this is p tag -->
                <form  id="newsletter" action="" class="form-inline" role="form">
                  <div class="form-group">
                    <label class="sr-only" for="exampleInputEmail2">Email address</label>
                    <input type="email" name="email" class="form-control" id="exampleInputEmail2" placeholder="Enter your email">
                    <button type="submit" class="btn">submit</button>  
                  </div>
                </form>
            </div>
            <div class="col-sm-7">
                <img src="img/cover.png" class="img-responsive main" alt="product" />
            </div>
        </div>
    </div>
</section>

Thank you!

Upvotes: 1

Views: 225

Answers (2)

Pranav C Balan
Pranav C Balan

Reputation: 115242

Try this,

body > section > .container > .row > .col-sm-5 > p
{ 
    color: red !important;
}

FIDDLE

for more about !important visit http://www.w3.org/TR/CSS2/cascade.html#important-rules

Upvotes: 2

Sajad Karuthedath
Sajad Karuthedath

Reputation: 15797

Check this..!!

FIDDLE

CSS:

#test{

    color:red !important;

}

you must be applying the css in two different ways..!! so u must tell which one should take. so '!important'.

Upvotes: 1

Related Questions