Elnaz Elnaz - 5 months ago 21
CSS Question

How to override position : absolute in css?

I have a menu on top of my page, and after that a

div
tag that uses
a
class as below:

<div class="a">
Hello!
</div>


a
is a general class that has
position: absolute;
in style.

I want to disable this absolute; since the
div
content not shown completely. So I decided to use another class that overrides the position setting.

<div class="a overridden-a">


What should I set for
position:
in
.overridden-a{ position: ???? !important }
in my other style?

Update: I don't want to edit the
a
class styles, It is common and general in project.

Answer

The default value of position is static.

The use of !important is not best practice and should be avoided where possible. Instead, to override a CSS rule you need to use a selector of a higher specificity. Try this:

.a.overridden-a{ 
    position: static;
}

position: relative; would most achieve what you require as well.

Comments