HTML / CSS: Ausrichtung von Elementen

man0l0

man0l0

Aktives Mitglied
Thread Starter
Dabei seit
04.09.2006
Beiträge
16.595
Reaktionspunkte
1.348
Auf meiner Startseite möchte ich 2 Buttons haben, die jeweils auf eine Subdomain verlinken.
Aussehen soll das so, wie im Anhang gezeigt.

Als Eigenschaft für diese beiden Elemente (1 und 2) hätte ich gerne, dass sie – unabhängig der Fenstergröße – immer zentriert darstellt werden.
Für ein Element alleine habe ich das geschafft. Nur weiß ich nicht, wie ich die beiden Elemente nochmals an der y-Achse spiegel.

Kann mir da jemand helfen?

veranschaulichung.jpg
 
Wenn es einfach sein soll und schnell:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Unbenanntes Dokument</title>
</head>

<body>
<table width="100%" >
<center>
<tr >
<td width="50%">
button 1
</td>
<td width="50%">
button 2
</td>
</tr>
</center>
</table>
</body>
</html>
 
  • Gefällt mir
Reaktionen: man0l0
oder sauberer ohne Tabellen:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>buttons</title>
<style type="text/css">
#button1, #button2 {
position: absolute;
top: 50%;
width: 100px;
margin-left: -50px;
background-color: #999;
text-align: center;
color: #fff;
font-family: Arial, Helvetica, sans-serif;
}
#button1 {
left: 33%;
}
#button2 {
left: 66%;
}
</style>
</head>
<body>
<div id="button1">1</div>
<div id="button2">2</div>
</body>
</html>
 
  • Gefällt mir
Reaktionen: man0l0
Danke euch beiden!
Werde ich ausprobieren und klingt verständlich. :)
 
Zurück
Oben Unten