Wie überschreibe ich left: 0 mit CSS oder Jquery?


103

Ich habe ein Element, das das folgende CSS hat:

.elem {
  left: 0;
  position: fixed;
  right: 0;
  width: 60%;
  z-index: 1000;
  }

Das Element erstreckt sich nicht über den gesamten Bildschirm. Ich möchte, dass es auf der rechten Seite des Bildschirms "ausgerichtet" wird.

Dies wäre einfach, wenn ich nur left: 0 entfernt hätte , aber das obige CSS nicht manipulieren könnte. Daher benötige ich CSS oder Jquery, um das left: 0- CSS zu überschreiben, zu deaktivieren oder zu entfernen .

Danke für die Hilfe!

Antworten:


238

Der Standardwert für leftist auto, setzen Sie ihn also einfach darauf und Sie werden ihn "zurücksetzen".

.elem {
  left: auto;
}

Stellen Sie sicher, dass das Obige nach der ursprünglichen CSS-Datei kommt.


1
VIELEN DANK! Ich habe es versucht, aber das hat mich nicht mehr erwischt. Gut zu wissen.
häufig

@frequent Sie könnten Werte wie '' verwenden, wenn Sie Javascript verwenden, ja, aber nicht in CSS. Wie auch immer, aber hast du nicht gesagt, dass du das Stylesheet nicht manipulieren kannst? In diesem Fall würde ein style="left:auto"Attribut im Element selbst den Trick ausführen und das Stylesheet überschreiben.
Herr Lister

8

Verwenden von CSS:

.elem {
    left: auto;
}

Verwenden von JQuery:

$(".elem").css("left", "auto");

4

Versuchen Sie die autoEigenschaft in CSS, die dem Standardwert entspricht.


2

Mit jquery:

$(".elem").css("left", "");

setzt dies nicht den angegebenen Wert zurück (in diesem Fall '0')?
Dion

1
@Antonio: Dies würde tatsächlich ein ungültiges "linkes" HTML-Attribut wie setzen, <div left="0">anstatt CSS zu ändern. Während Jans Kommentar noch steht (dh JS ist nicht erforderlich), könnte er mit $(".elem").css("left", "");oder so gemacht werden.
ov

Ops, das stimmt ... bearbeiten und setzen Sie diese mögliche Lösung. Vielen Dank.
Antonio Beamud

0

Unabhängig davon, ob es sich bei diesem extrahierten Stil um einen externen oder einen internen Stil handelt, können Sie ihn mit einem internen überschreiben, z.

.elem {
    position: fixed;
    right: 0;
    width: 60%;
    z-index: 1000;
  }
Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.