Menu
This is driving me crazy!
I have two divs, right after the body tag. They are both absolute positioned and sized. They both have the same "left" property, but i later declare the "right" property for the second div (so "left" should be ignored!).
Here's the HTML:
<body>
<div class="previousPageButton"></div>
<div class="nextPageButton"></div>
And the CSS: (There's more code to it but it's commented out so it's irrelevant.)
.previousPageButton, .nextPageButton {
position: absolute;
top: 0px; left: 0px;
display: block;
height: 500px;;
width: 100px;
background: transparent url(../images/buttons/arrow_previousPage.png) no-repeat center center;
z-index: 2;
opacity: .1;
}
.nextPageButton {
top: 0px; right: 150px;
background: transparent url(../images/buttons/arrow_nextPage.png) no-repeat center center;
}
As you can see, BELOW the first CSS where i declare the "left", i have another block of CSS where i specifically declare the "right" property for .nextPageButton. Body is relatively positioned, as usual, so it should work! Do i need to "unset" the "left" property before declaring the "right" property? Is that even possible?
I know i could rip the "left" property out of the first codeblock, and then assign each div it's own left/right property.. but this should still work!
Any thoughts?
418
left and right are not mutually exclusive.
An element can have both the left and right properties set, like this.
If you want to "remove"/"reset" left, then you should apply left: auto.
You can lookup the "inital value" of properties, for example here's left.
188
There is some inheritance that is causing a conflict. Add left: auto; to the .nextPageButton class to prevent.
44
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
