chrome stellt meine website falsch dar

Software Browser
 
hallo zusammen,

mein chrome-browser macht mich gerade fertig, denn in ihm hat meine website einen layout-fehler.
auf allen anderen browsern oder einem zweitrechner (inkl chrome) kommt es zu keinen problemen.

habe schon die browserdaten gelöscht und alle erweiterungen deaktiviert.
eigentlich ging es immer ohne probleme. habe an der website auch nichts geändert.
was sich bei chrome im hintergrund ändert, kann ich nicht sagen.

was kann das sein?
Link zu diesem Beitrag in die Zwischenablage kopieren
Mister Ad
Werbung
Schon mal bei Amazon geguckt? Vielleicht wirst du dort fuendig.

 
Zoomstufe?
Link zu diesem Beitrag in die Zwischenablage kopieren
Editiert: 10.10.14, 12:47 Uhr
nein. aber das zoomen verändert doch so oder nicht das layout. außer halt, dass es zoomt rafftnix
Link zu diesem Beitrag in die Zwischenablage kopieren
Werde doch mal konkreter, poste ein/zwei Screenshots.
Oder den Link zum Fehler.

So ist das doch Rumraten und Zeitverschwendung
Link zu diesem Beitrag in die Zwischenablage kopieren
wo du recht hast …

also folgende seite:
herrfreund.de

es geht um die rollover auf der startseite.
eigentlich werden die arbeiten grau und man sieht einen mittigen text.
bei mir ist der text aber nach oben verschoben.

zudem werden einige bilder gar nicht angezeigt.
Link zu diesem Beitrag in die Zwischenablage kopieren
bitte ausfüllen:

System:
Browser:
Auflösung:
Extensions:
Link zu diesem Beitrag in die Zwischenablage kopieren
das

  1. .textmiddle {
  2. position: relative;
  3. text-align: center;
  4. top: 50%;
  5. transform: translateY(-50%);
  6. }
Quelltext in Zwischenablage kopieren

top:50% greift bei dir nicht. ist aber seltsam, irgendein ; oder so davor vergessen? cache nochmal leeren
Link zu diesem Beitrag in die Zwischenablage kopieren
Falls es Dich beruhigt: Bei mir wirds auch falsch angezeigt. (aktueller Firefox)

Braucht nicht top: 50% eine bekannte Höhe?
Link zu diesem Beitrag in die Zwischenablage kopieren
Sieht in meinem Chrome auch so aus. (Edit...)
Link zu diesem Beitrag in die Zwischenablage kopieren
Das text-align: center ist ja horizontal.
Vertikal geht er über das top und transform. Dafür braucht der Block aber eine bekannte Höhe.


Spoiler (anzeigen):

Ich hätte Apfel-U nicht machen dürfen! heul
Link zu diesem Beitrag in die Zwischenablage kopieren
Jo, morgentliche Verpeilung. Ich mache sowas halt immer mit vertical-align: middle; und hatte es auf den ersten Blick verwechselt.
Probier mal:

.textmiddle {
position: relative;
text-align: center;
margin-top: 25%;
}
Link zu diesem Beitrag in die Zwischenablage kopieren
Martin R. schrieb am 10.10.14, 14:02 Uhr:

Ich mache sowas halt immer mit vertical-align: middle;

Find ich auch wesentlich eleganter.
Link zu diesem Beitrag in die Zwischenablage kopieren
  1. .textmiddle {
  2. position: absolute;
  3. text-align: center;
  4. top: 50%;
  5. transform: translateY(-50%);
  6. width: 100%;
  7. }
Quelltext in Zwischenablage kopieren

getestet, fluppt.
Link zu diesem Beitrag in die Zwischenablage kopieren
vertical align funktioniert aber nicht. zumindest hat es das bei mir nie.

was mich halt wundert, ist die tatsache, dass alles bis heute funktioniert hat. und dann auf einmal brain

@caZpa, vielen dank, das teste ich mal. edit: funktioniert, vielen dank! cheer

jetzt müsste ich nur noch herausfinden, warum ich die letzten drei arbeiten nicht sehe und nur die leeren hintergründe habe?
Link zu diesem Beitrag in die Zwischenablage kopieren
Hätte Martin seinen Post nicht editiert, wüsstest Du, dass vertical-align nur auf table-cells angewendet werden kann (echte tds oder per display: table-cell; was wiederum erfordert, dass entsprechende Wrapper (display:table und display:table-row) zur Verfügung stehen). hörthört
Link zu diesem Beitrag in die Zwischenablage kopieren
Rusty schrieb am 10.10.14, 14:45 Uhr:

Hätte Martin seinen Post nicht editiert, wüsstest Du, dass vertical-align nur auf table-cells angewendet werden kann (echte tds oder per display: table-cell; was wiederum erfordert, dass entsprechende Wrapper (display:table und display:table-row) zur Verfügung stehen). hörthört

und deswegen ist vertical-align:middle auch nicht immer so elegant
Link zu diesem Beitrag in die Zwischenablage kopieren
hab das letzte problem mit den nicht dargestellten bildern auch gelöst. chrome wollte meine bilder nicht darstellen wenn height:100% / width:auto zugewiesen war. andersherum geht es dann.
vielleicht gab es irgendein update in chrome der dazu führte, dass hier gewisse sachen nicht mehr funktionierten. planlos
Link zu diesem Beitrag in die Zwischenablage kopieren
und deswegen ist vertical-align:middle auch nicht immer so elegant

Kommt drauf an, man ist halt flexibler. Prozent-Lösungen funktionieren nur in Kombination mit anderen Lösungen, wenn es wirklich mittig sein soll, was aber nur geht, wenn man die exakte Höhe des Elementes kennt. Daher wird Herrfreund mit der aktuellen Lösung früher oder später auf Probleme stossen, die sich mit Css alleine nicht mehr lösen lassen.
Link zu diesem Beitrag in die Zwischenablage kopieren
Link zu diesem Beitrag in die Zwischenablage kopieren
Robin schrieb am 10.10.14, 19:24 Uhr:

Flexbox!

IE11
Link zu diesem Beitrag in die Zwischenablage kopieren
Rusty schrieb am 10.10.14, 21:04 Uhr:

Robin schrieb am 10.10.14, 19:24 Uhr:

Flexbox!

IE11

Win 7, IE11, die Frisur sitzt.
Link zu diesem Beitrag in die Zwischenablage kopieren
Joa, aber unter 11 geht nix.
Link zu diesem Beitrag in die Zwischenablage kopieren
hörthört
Link zu diesem Beitrag in die Zwischenablage kopieren
Für mich jedenfalls ist das ein Argument.
Link zu diesem Beitrag in die Zwischenablage kopieren
#