Jak usunąć właściwość Left, gdy pozycja: bezwzględna?

137

Zastępuję CSS witryny do wersji RTL po wybraniu określonego języka.

Mam element, który musi mieć bezwzględne pozycjonowanie. W wersji LTR tak left: 0px;i jest wyrównany do lewej; w wersji RTL chcę zrobić odwrotnie right, ale leftwłaściwość nie jest nadpisywana, więc nadal pozostaje po lewej stronie.

  • Próbowałem hakować !important, ale to nie zadziałało.
  • Próbowałem ustawić left: none, ale to nie zadziałało.

Jak mogę ustawić go na brak lub całkowicie usunąć podczas zastępowania?

css css-position eric.itzhak
źródło
Aby usunąć tylko określony atrybut css, taki jak left:var cssObject = $('selector').prop('style'); cssObject.removeProperty('left');
ilgaar

Odpowiedzi:

321 
left:auto;

Spowoduje to leftprzywrócenie domyślnych ustawień przeglądarki.

Więc jeśli masz swoje znaczniki / CSS jako:

<div class="myClass"></div>

.myClass
{
  position:absolute;
  left:0;
}

Ustawiając RTL, możesz zmienić na:

<div class="myClass rtl"></div>

.myClass
{
  position:absolute;
  left:0;
}
.myClass.rtl
{
  left:auto;
  right:0;
}
Lakoniczny
źródło
20

W przyszłości można by użyć left: unset;do rozbrojenia wartości left.

Od dzisiaj 4 listopada 2014 unsetjest obsługiwany tylko w przeglądarce Firefox.

Przeczytaj więcej o nieustawianiu w MDN.

Domyślam się, że będziemy mogli go używać około 2022 roku, kiedy IE 11 zostanie właściwie wycofany.

Jonas Ęppelgran
źródło
IE wstawia „IE” w „I'll Never DIE”.
Adam Rowe
1
Pod koniec roku 2017 Microsoft Edge build 10565+ obsługuje go
Taras Yaremkiv
Właśnie użyłem tego do wyczyszczenia rightpozycji dla elastycznej zmiany - działało idealnie (w Chrome)
SenAnan
1 
left: initial

Spowoduje to również leftprzywrócenie domyślnych ustawień przeglądarki.

Ale ważne, aby wiedzieć, property: initialnie jest obsługiwane w IE.

MORHERO
źródło