CODEWITHSUNDEEP
htmlcss
John Barr
John Barr

Reputation: 105

Padding Overwriting Later Padding

quick question about my stylesheet. I was always taught that CSS overwrites up to down. So something on line 1 could be overwritten by something on line 10. I'm trying to increase the padding in a section, but not touch the other style:

This is on Line 642

&:first-of-type > div {
        padding-top: 10px;
        img {
            margin-bottom: 20px;
        }
}

This is on Line 722

.apiPT {
    padding-top: 32px;
}

I don't even want to mention that I don't believe my HTML should be picking up the style from 642, but it is and it's being overwritten by it. I really would love to avoid using !important as that's obviously not too good. But not really sure why I'm having this issue...

<div class="col-md-7 col-md-offset-5 apiPT">
                <ul class="pipe">
                    <li><a href="api-reference/v3">API references</a></li>
                </ul>
</div>

Upvotes: 0

Views: 256

Answers (2)

John Barr
John Barr

Reputation: 105

The answer is just as @sn3ll said:

.class1 .class2 .apiPT {
  ...
}

gave it a higher priority - thanks for the help!

Upvotes: 0

Thomas Ray
Thomas Ray

Reputation: 103

You could assign an id tag to the link if it is the only link there

<a href="api-reference/v3" id="example" >API references</a>

That would overwrite it

Upvotes: 1

Related Questions