zurück zur Startseite
  


Zurück XHTMLforum > (X)HTML und CSS > CSS
Seite neu laden Bild vertikal zentrieren in Blockelement in IE nur m. TABLE

Antwort
 
LinkBack Themen-Optionen Ansicht
  #1 (permalink)  
Alt 13.03.2006, 14:03
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard Bild vertikal zentrieren in Blockelement in IE nur m. TABLE

Hallo,

ich selber setze das vertikale Zentrieren von Bildern als Gestaltungsmittel selten ein. Das wird der Grund sein, warum es mir bisher entgangen war, dass IE das vertikale Zentrieren von Bildern innerhalb eines Blockelementes nicht beherrscht.

Code:
<div><a ...><img ... /></a></div>
Lässt sich das Bild (zu einem Link) wirklich nur vertikal zentrieren, wenn man das Markup mit einer Tabelle versaut?

Code:
<table><tr><td><a ...><img ... /></a></td></tr></table>
__________________

Mit Zitat antworten
Sponsored Links
  #2 (permalink)  
Alt 13.03.2006, 14:32
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.858
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Vielleicht hilft Dir das Prinzip weiter, das ich auf einer meiner Seiten einsetze. Dort steht nur ein <div> (mit fester Höhe), das folgendermaßen vertikal zentriert wird:

Code:
<div id="verticalcenter"></div>

<div id="container"></div>
Die CSS-Datei dazu:

Code:
html, body {
height: 100%;
margin: 0;
padding: 0; }

#verticalcenter {
width: 5px;
height: 50%;
float: left;
margin: 0 0 -200px; }

#container {
height: 400px;
clear: left; }
float und clear bewirken, daß <div id="container"> bei kleinem Bildschirmfenster nicht nach oben "herausgeschoben" wird.

Falls bei Dir das betreffende Bild nur ein Element von vielen auf einer Einzelseite ist, wirst Du natürlich anders an das Problem herangehen müssen, aber evtl. ist es ja doch eine Anregung.

Schöne Grüße,
Heiko
Mit Zitat antworten
Sponsored Links
  #3 (permalink)  
Alt 13.03.2006, 14:44
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von heiko_rs
Vielleicht hilft Dir das Prinzip weiter, das ich auf einer meiner Seiten einsetze.
@heiko_rs

Schön wäre wenn Du auch erwähnen würdest woher dieses Prinzip stammt!


Orginal von fricca
__________________
</ulle>
Mit Zitat antworten
  #4 (permalink)  
Alt 13.03.2006, 15:09
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard

Danke für Eure Hinweise.

Mir ist der CSS-Code zu länglich und ich spüre wenig Lust, alle Folgeeffekte zu beherrschen.

Das Zentrieren möchte ich in geschmeidig transformierenden Bildübersichten in Galerien einsetzen.
Beispiel:
http://borumat.de/html/bsp-und-tests...untertitel.php

Mein aktuelles Fazit:
Wenn keine überschaubaren CSS-Lösungen vorgeschlagen werden, werde ich das Markup mit einer einzelligen Tabelle verhunzen.
Sicher eine Form des Kompromisses, die hier von vielen nicht geteilt wird.
__________________

Mit Zitat antworten
  #5 (permalink)  
Alt 13.03.2006, 15:48
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 02.06.2003
Beiträge: 2.441
ulle befindet sich auf einem aufstrebenden Ast
Standard

Zitat:
Zitat von Andreas Borutta
Mein aktuelles Fazit:
Wenn keine überschaubaren CSS-Lösungen vorgeschlagen werden, werde ich das Markup mit einer einzelligen Tabelle verhunzen.....
Klingt wie eine Drohung........
__________________
</ulle>
Mit Zitat antworten
  #6 (permalink)  
Alt 13.03.2006, 16:17
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von Andreas Borutta
http://borumat.de/html/bsp-und-tests/galerieuebersicht-div-horizontal-vertikal-zentriert-ohne-untertitel.php
http://www.jakpsatweb.cz/css/css-ver...-solution.html
Bei deinem Beispiel brauchst du nicht mal zusätzliches Markup.
Mit Zitat antworten
  #7 (permalink)  
Alt 13.03.2006, 17:13
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard

Zitat:
Zitat von ulle
Zitat:
Zitat von Andreas Borutta
Mein aktuelles Fazit:
Wenn keine überschaubaren CSS-Lösungen vorgeschlagen werden, werde ich das Markup mit einer einzelligen Tabelle verhunzen.....
Klingt wie eine Drohung........
Oh. Das war absolut nicht meine Absicht.

Das Gegenteil ist der Fall.
__________________

Mit Zitat antworten
  #8 (permalink)  
Alt 13.03.2006, 17:19
Benutzerbild von heiko_rs
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 18.09.2005
Ort: Berlin
Beiträge: 9.858
heiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblickheiko_rs ist ein wunderbarer Anblick
Standard

Zitat:
Zitat von ulle
@heiko_rs

Schön wäre wenn Du auch erwähnen würdest woher dieses Prinzip stammt!

Orginal von fricca
Zur Zeit dieses Postings war ich noch nicht Mitglied dieses Forums, ich habe das Prinzip aus einem anderen Thread, den ich nicht mehr gefunden habe, und aus dem auch eh nicht hervorging, wessen "Erfindung" es war.
Mit Zitat antworten
  #9 (permalink)  
Alt 13.03.2006, 17:27
Erfahrener Benutzer
XHTMLforum-Kenner
 
Registriert seit: 28.01.2005
Beiträge: 11.778
fricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz seinfricca kann auf vieles stolz sein
Standard

Zitat:
Zitat von heiko_rs
ich habe das Prinzip aus einem anderen Thread, den ich nicht mehr gefunden habe
Hm?
Mit Zitat antworten
Sponsored Links
  #10 (permalink)  
Alt 13.03.2006, 17:34
Benutzerbild von AndreasB
Erfahrener Benutzer
XHTMLforum-Kenner
Thread-Ersteller
 
Registriert seit: 29.11.2005
Beiträge: 1.326
AndreasB wird schon bald berühmt werden
Standard

Zitat:
Zitat von fricca
Zitat:
Zitat von Andreas Borutta
http://borumat.de/html/bsp-und-tests/galerieuebersicht-div-horizontal-vertikal-zentriert-ohne-untertitel.php
http://www.jakpsatweb.cz/css/css-ver...-solution.html
Bei deinem Beispiel brauchst du nicht mal zusätzliches Markup.
Sehr interessantes CSS. Vielen Dank.

Bisher ist es mir noch nicht gelungen, das CSS für das obige Beispiel entsprechend anzupassen.

Das wird an meiner bisherigen Unerfahrenheit mit den Eigenschaft "postion" oder "top" liegen.
Ich gestehe auch offen, dass meine Erfahrung mit Positionierungen stets schlechte waren.

Ich werde mich nochmal später in Ruhe dranmachen.

Was mir auffiel: das Beispiel von "jakpsatweb.cz" verwendet drei geschachtelte DIVs.
Bei mir sind es zwei.

Edit:
Richtig hübsch wäre HTML-Code, wo der innere DIV-Container weggelassen werden kann und dennoch die Bilder in einem "Diarahmen" präsentiert werden.
Sprich: Das A-Element würde als "Diarahmen" fungieren.

Code:
<div>
 <a ...><img ... /></a>
 <a ...><img ... /></a>
 ...
</div>
Das sind Euch noch zu geringe Herausforderungen?
Ok.
Eine richtig gute Galerieübersicht erlaubt das Tauschen der Vorschaubilder sowohl für besuchte Bildlinks als auch für gehoverte.
Schließlich möchte der Webautor den Nutzer in einer Gruppe von Bildlinks keine schlechtere Orientierung bieten als in einer Gruppe von Textlinks.

Aber auch das Tauschen von Bildern kann man mit IE vergessen.

Ach ja: Randbedingung selbstverständlich.
Das Dokument soll ohne CSS "normale" Vorschaubilder zeigen und keine doppelten wie in Variante zwei.

http://borumat.de/html/bsp-und-tests...ustauschen.php
(Vorsicht! haarig. Wehe, einer lacht!)
__________________

Mit Zitat antworten
Sponsored Links
Antwort

Themen-Optionen
Ansicht

Forumregeln
Es ist Ihnen nicht erlaubt, neue Themen zu verfassen.
Es ist Ihnen nicht erlaubt, auf Beiträge zu antworten.
Es ist Ihnen nicht erlaubt, Anhänge hochzuladen.
Es ist Ihnen nicht erlaubt, Ihre Beiträge zu bearbeiten.

BB-Code ist an.
Smileys sind an.
[IMG] Code ist an.
HTML-Code ist aus.
Trackbacks are an
Pingbacks are an
Refbacks are aus


Ähnliche Themen
Thema Autor Forum Antworten Letzter Beitrag
Bild & Text vertikal zentrieren Flux CSS 6 23.08.2009 01:14
Myspace problem... Rechte Säule verschiebt sich im IE. calledmarcel CSS 1 27.02.2009 10:12
Bild vertikal zentrieren Cheops07 CSS 6 14.10.2006 11:37
H1 vertikal zentrieren in Blockelement vertex CSS 4 09.08.2006 13:34
Bild vertikal zentrieren danysahne1983 CSS 1 10.07.2006 11:01


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:40 Uhr.