[CSS] Breite eines Elements auslesen und einer Variable übergeben (Stylish)

cbtestarossa

Admiral
Dabei seit
Okt. 2011
Beiträge
7.747
]Hallo, zuerst einmal angemerkt das ich kein Webdesigner bin und ich gerade mit Stylish an einem Style für CB herumbastle. Ich hoffe ich drücke mich richtig aus, ansonsten bitte gerne verbesseren.

Nun gibt es auf dieser Homepage ein "Element" das nennt sich .col-main

Wenn ich mit Firefox Element untersuchen anklicke kommt so ein Inspektor-Fenster
wo im rechten Fenster folgendes steht:

Code:
.col-main {
    float: left;
    margin-right: 10px;
    padding-right: 0px;
    width: 630px;
}
somit weiß ich dass die Vorgabe 630px dafür ist.

nun würde ich die Breite in PX aber gerne mittels dem Addon STYLISH irgendwie auslesen und einer selbst angelegten Variable übergeben um damit rechnen zu können.

Momentan sieht mein Code im Stylish-Style so aus
Code:
/* nach rechts einrücken und verschmälern (Originalbreite=630px) */ 
.col-main {
  --Versatz:14px; /* Variable VERSATZ definieren und den Wert 14px zuteilen */
  margin-left:var(--Versatz)!important;
  width: calc(630px - var(--Versatz))!important;
}

ich will quasi dass anstelle des von mir fest angegebenen Wertes von
width: calc(630px -
dann
width: calc(var(--variable_mit_wert_der_breite_in_px) -
steht

Jemand ne Idee wie man das ausliest?
 
Zuletzt bearbeitet:

rg88

Fleet Admiral
Dabei seit
Feb. 2015
Beiträge
25.930
zum ersten: .col-main ist eine css-Klasse

Zweitens: Was hast du genau vor, dann kann man dir vll weiterhelfen
 

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747
naja ich mach mit STYLISH ein Design, ich überschreibe quasi damit im FF das neue CB-Design

wenn ich die Breite auslesen könnte dann ginge das leichter bzw. automatisiert falls sich da mal was ändert im Original

Hier siehst du was ich meine
http://fs2.directupload.net/images/150408/4xitjnek.png
 
Zuletzt bearbeitet:

rg88

Fleet Admiral
Dabei seit
Feb. 2015
Beiträge
25.930
document.getElementElementById("IDdesELEMETS").width
so kannst du die eigenschaft eines bestimtes elements auslesen
 

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747
Das habe ich auch schon irgendwo gelesen, kapier da nichts.
Wo finde ich die ID ?
Und wo steht dann der Wert und wie weise ich den einer Variablen zu?
Ich brauche nur den genauen Code um es zu verstehen, so versteh ich nur Bahnhof
 
Zuletzt bearbeitet:

Yuuri

Fleet Admiral
Dabei seit
Okt. 2010
Beiträge
12.500
Nix da, auslesen, Variablen setzen und irgendwo was setzen ist mit CSS nicht. Das geht nur mit SCSS oder Less, aber das kannst du hier nicht anwenden. Du könntest das höchstens lokal verwenden und die resultierende CSS dann in Stylish nutzen.
 

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747
Also kann ich das nun auslesen oder nicht?
Ich habe schon gegoogelt wie blöd aber finde nichts.
Auch sind die Anleitungen generell eher mau und für Stylish finde ich auch kein HELP.

FF kann das ja auch irgendwie, weil er mir ja im Browserfenster über dem gerenerten Bild anzeigt was die Breite des Elements ist (oder wie auch immer diese Spalte heißt ) wenn ich ELEMENT UNTERSUCHEN wähle.


Vollbild: http://fs2.directupload.net/images/150409/qrultml3.png
 
Zuletzt bearbeitet:

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747

Madman1209

Fleet Admiral
Dabei seit
Nov. 2010
Beiträge
24.557
Hi,

das ist JavaScript! Wenn Stylish mit JavaScript arbeiten kann geht es, wenn nicht (wovon ich ausgehe) dann nicht.

VG,
Mad
 

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747
Ja das ist ja genau das was ich von euch wissen will.
Ich bin da echt nicht fit darin.
Ich suche ne Lösung und weiß nicht wie ich das machen soll mittels STYLISH.
 

Madman1209

Fleet Admiral
Dabei seit
Nov. 2010
Beiträge
24.557
Hi,

nochmal: wenn Stylish nur CSS kann kannst du darin nicht mit JavaScript arbeiten - das geht schlicht nicht!

VG,
Mad
 

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747
Das habe ich verstanden, aber ändert nichts daran.
Ich will das irgendwie lösen.
Kann man denn STYLISH nicht irgendwie mit JS kombinieren o.ä..?
 

Yuuri

Fleet Admiral
Dabei seit
Okt. 2010
Beiträge
12.500
Nein, Stylish ist CSS. Und dort heißt es definieren oder vererben, nicht "Nimm die Breite von da und sowieso". Und SCSS/Less sind da auch nicht viel anders, außer dass du dort bspw. Variablen nutzen kannst.
 

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747
Stylish kann doch auch Variablen verwenden.
Schau doch oben im unteren Code, da habe ich eine Variable --versatz definiert und ihr einen Wert 14px zugeteilt. und STYLISH rechnet dann damit. CALC(
 
Zuletzt bearbeitet:

Nase

Lieutenant
Dabei seit
Jan. 2004
Beiträge
592
Das hat aber weniger mit Stylish an sich zu tun, als vielmehr damit, dass Firefox CSS-Variablen unterstützt. Das hat Stylish nur aufgegriffen.
 

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747
naja zumindest funktioniert das irgendwie, bin darauf auch nur zufällig irgendwo gestoßen.

Wie könnte ich das nun angehen dass ich die Breite irgendwie einlesen kann?
 

Yuuri

Fleet Admiral
Dabei seit
Okt. 2010
Beiträge
12.500

cbtestarossa

Admiral
Ersteller dieses Themas
Dabei seit
Okt. 2011
Beiträge
7.747
Ja das habe ich alles schon gesehen und auch herumprobiert.

Ich will das lösen und ich glaube es gibt eine Lösung.
Nur kenne ich mich zu wenig aus mit dem ganzen.

auf
document.getElementElementById("IDdesELEMETS").width
bin ich auch irgendwo schon gestoßen und ich dachte das könnte funktionieren.

nur blick ich da nicht durch wo ich diese ID finde bzw was die überhaupt ist und wo die steht
 
Top