CODEWITHSUNDEEP
htmltarget
user2379921
user2379921

Reputation: 3

Apply :target styles to div inside target div?

Looking to apply :target styles only to div inside div with id="item1". I'm doing this so that I can use padding to get the referenced div spaced from the top of the window, but only have the styling surrounding the text (instead of having a big padding at the top that also inherits the style).

html:

<a href="#item1"> Item 1 </a>

<div id="item1" style="padding-top: 30px;">
<div class="I want only this div with coloured background">
  <h4>item1 title</h4>
  <p>item1 content</p> 
</div>
</div>

css:

:target {
  padding: 2px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;}

Thanks in advance for your help!

ANSWER:

css:

:target > div {
  padding: 2px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;}

Upvotes: 0

Views: 163

Answers (1)

code-jaff
code-jaff

Reputation: 9330

Extracted from the question specified by OP

:target > div {
  padding: 2px;
  background-color: #f5f5f5;
  border: 1px solid #e3e3e3;
}

Upvotes: 1

Related Questions