NTH-child not working properly [closed] - html

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 8 years ago.
Improve this question
On some elements i can use the NTH-child selector, which is an 2nd level element (parent > child)
but in the child ive got a 3rd level element (parent > child > child) which i cant seem to trigger with selectors individually. it only triggers all of them or none.

first of all you should use id only once in html.If you want what you have now you should use class not id.
second of all you only have one innerblock in your block div.so instead of innerblock:nth-child(1) you can use innerblock.
section#top .block .innerblock{
background: #ddd !important;
}
fiddle
UPDATE :
if you want to change .innerblocks seperatly for eatch block.use this css
section#top .block:nth-child(1) .innerblock{
background: #ddd !important;
}
fiddle

Related

Using :not() in CSS to avoid certain class from using those properties [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 1 year ago.
Improve this question
So I saw online that using the :not() selector in CSS makes it so that whatever class you specified in the parenthesis will not apply those properties too. But that doesn't seem to be the case for me. For example,
.test .btn div:not(.classtoavoid){
...
...
...
}
So when I do what I showed above, it doesn't apply those properties to the .btn class where they don't have the div with class (classtoavoid). Am I using the :not selector incorrectly?
No
.test .btn div:not(.classtoavoid){
...
...
...
}
This does not select the .btn class, it selects any div which is a descendant of .btn which does not have the selected class.
You can't apply CSS to a parent based on a child (at least not yet).
You want :has() but that basically has almost (actually none) no support as yet.

Can't change hover color on bootstrap 4 navbar-brand class [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 2 years ago.
Improve this question
Here is the code
.navbar-brand a:hover {
color: #43cea2 !important;
}
<a class="navbar-brand" href="#about">Cole Caccamise</a>
Have you tried using inline style?
This isn't always the best solution but usually works for me
You could also add a custom class or Id to the element
.navbar-brand a{
color: #43cea2;
}
This means Select any anchor(a) element that is a child of any element with a class name of "navbar-brand".
you need to use-
a.navbar-brand:hover {
color: #43cea2;
}
you can read more here:
https://css-tricks.com/whats-the-difference/

Can't target this child [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
I want to target the class has-translucent-status-bar which is located inside another class named platform-ios
For that I've tried to do:
.platform-ios > .has-translucent-status-bar
So far, I was not lucky enough to do so, here is a screenshot of the code:
You should go with:
.platform-ios .has-translucent-status-bar
The child selector/combinator you used is for direct children:
The > combinator separates two selectors and matches only those
elements matched by the second selector that are direct children of
elements matched by the first.
In your specific case, the only, or one among the others, direct child of .platform-ios is ion-app element.

CSS: select specific child [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 6 years ago.
Improve this question
I want to add border in the select element below using css, im new to web development it would be a great help if you can show me how, thankyou.
To add a 1 pixel solid black border to just the element shown in your screenshot, the following CSS should do the trick:
#menu-item-83 > .submenu {
border: 1px solid black;
}
The # prefix references an element by id. The > specifies that the following element should be a direct child of the preceding matched element. And the . prefix references an element by class name.
This works fine for me:
#menu-primary #menu-item-83 > ul.sub-menu {
border: 1px solid #000;
}
https://jsfiddle.net/ccd7tLxm/

HTML, CSS: How to override settings from *{}(!important is not working) [closed]

Closed. This question needs debugging details. It is not currently accepting answers.
Edit the question to include desired behavior, a specific problem or error, and the shortest code necessary to reproduce the problem. This will help others answer the question.
Closed 7 years ago.
Improve this question
In my code I set the text to be red, but it is not working. Can anybody help me with this? JSFiddle: https://jsfiddle.net/uk1u62vf/2/
Thank you!
Add p into
.list-item > .card {
color:red !important;
}
Should look like this
.list-item > .card p{
color:red;
}
you could also replace it with
.content p{
color:red;
}
EDIT: Explanation
You didn't target paragraph element. You have targeted div element with class card which is parent of div with class content which is again parent of paragraph you are trying to target.