I have an <a>
element that inside has an h6
and normal text. How I can style the normal text part?
I’m trying to use :not(h6)
to put padding and border-radius:20px and others styles… see my css:
.uagb-taxomony-box {
background-color:transparent!important;
border:none!important;
text-decoration:none!important;
text-align:left!important;
}
a.uagb-tax-link h6{text-align:left!important;}
.uagb-tax-link:not(h6){
text-decoration:none!important;
padding:5px!important;
background-color:#18419C!important;
border-radius:20px!important;
}
<div class="uagb-taxomony-box">
<a class="uagb-tax-link" href="https://dev3.netnerd.cat/tipus/desenvolupament-de-negoci/">
<h6 class="uagb-tax-title">Desenvolupament de negoci</h6>
" 16 Projectes "
</a>
</div>
but watch what is happening in the screenshot below:
How can I style well this?
Thanks in advance
3
Answers
As https://stackoverflow.com/users/16948533/developer has pointed I need to add a span here for properly style the no-h6 part.
Then i've used something like:
And then css get's modyfied as:
You can give display: inline-block to "a" element. If you want to give background to only text. Then put the text in span element and give styling to it. Here is the updated code:-
You can use
position: absolute
: