Der folgende Beitrag wurde am 19. 12. 2007, 15:45 Uhr von falkost veröffentlicht.
Hallo Forum,
ich habe das Problem, dass ich einen Div-Container. in dem eine ul-Liste mit Links liegt, nicht vertikal in Bezug zum umgebenden Div-Container zentriert bekomme.
Folgender HTML-Code:
<div class="block_default">
<div class="sprachen">Sprache</div>
<div class="mieter">
<ul>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
<li>Link</li>
</ul>
</div>
</div>
Dabei ist die Menge der Links unbestimmt, so dass sich diese Box automatisch immer vertikal ausrichten sollte.
Dazu gehört derzeit noch folgender CSS-Code:
html {
margin: 0px;
padding: 0px;
height: 100%;
width: 100%;
}
body {
margin: 0px;
padding: 0px;
height: 100%;
width: 100%;
}
.block_default {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
text-transform: uppercase;
color: #7780AA;
text-decoration: none;
background-color: #B1AECD;
letter-spacing: 5px;
height: 100%;
min-height: 700px;
width: 955px;
background-repeat: no-repeat;
background-position: center center;
padding: 0px;
border-right-width: 1px;
border-left-width: 1px;
border-right-style: dashed;
border-left-style: dashed;
border-right-color: #959ABF;
border-left-color: #959ABF;
margin-top: 0px;
margin-right: auto;
margin-bottom: 0px;
margin-left: auto;
border-top-style: none;
border-bottom-style: none;
background-image: url(../images/intro.gif);
vertical-align: middle;
}
.block_default .sprachen {
margin: 0px;
padding: 20px;
height: auto;
width: 400px;
float: left;
}
.block_default .mieter {
padding: 20px;
float: right;
margin: 0px;
}
.block_default .mieter ul {
padding: 0px;
list-style-type: none;
margin: 0px;
}
.block_default .mieter ul li {
padding-top: 3px;
padding-bottom: 3px;
}
Hat jemand eine Idee, wie man dies bewerkstelligen könnte ?
Versuche mit einer versteckten Box, welche bei 50%|50% absolut liegt, klappen nicht. Die umgebende Box muss schon 100% Höhe haben, damit das Hintergrundbild immer mittig ist.
VG
falkost
Der folgende Beitrag wurde am 19. 12. 2007, 16:54 Uhr von Ingo Turski veröffentlicht.
Hi,
> Dabei ist die Menge der Links unbestimmt, so dass sich diese Box automatisch immer vertikal ausrichten sollte.
dazu bräuchtest Du 'vertical-align' - aber leider:
Applies to: inline-level and 'table-cell' elements
Also keine Chance für ein DIV - jedenfalls nicht im IE, so dass Du nur eine richtige Tabelle verwenden könntest.
freundliche Grüße
Ingo
--
[barrierefreie Ingo Webdesign » Suchmaschinenoptimierung | em? | IE7 - Bugs]
Der folgende Beitrag wurde am 19. 12. 2007, 23:06 Uhr von ChrisB veröffentlicht.
Hi,
> Hat jemand eine Idee, wie man dies bewerkstelligen könnte ?
Vielleicht hilft dir das weiter:
http://www.jakpsatweb.cz/css/css-vertical-center-solution.html
MfG ChrisB
© 1998-2013 SELFHTMLImpressumSoftware: Classic Forum 3.4