Issue
I have some HTML as follows ( you can assume closing tags )
<ion-content>
<ion-tab>
The problem is, when the DOM is created, the HTML5 tag creates a div which I cannot edit using CSS
It becomes as so
<ion-content>
<div class="foo">
<ion-tab>
I need to edit the CSS of the div whose class is "foo", however, if i change the CSS of foo, i change the CSS of all the classes using "foo".
How do I specifically apply CSS to that specific div when I dont create it myself?
Solution
With the small amount off details you have given us, all I can do is refer to these CSS Selectors.
There are number off ways to style a specific element. All have been explained in detail in the link I have given you.
Edit: CSS Selectors explained in detail.
There are several ways to change the style of <div class="foo">
.
- You could give the div an (extra) #id or class. This makes it able to apply certain styles, just you would do normally, to this specify element.
- Another option would be
parent child {}
where you could style all the children within parent. Note: you could add '>/+/~' to be more specific of the place of child within parent. - A third option would be to specify at what place the div is within its parent using
:nth-child(n)
ornth-of-type(n)
.
As I said before, there are many ways to style a specific element. Please take a look at the link I provided.
Answered By - Berendschot
0 comments:
Post a Comment
Note: Only a member of this blog may post a comment.