nicht angemeldet
Hallo!
Ich hab mich schon wahnsinnig gegooglt und auch auf HTML/CSS Seiten nach der Lösung gesucht. Wer weiss vielleicht geh ich ja die Sache falsch an. Auf alle Fälle komm ich ohne Hilfe nicht mehr zurecht und hoffe das mir hier wer weiterhelfen kann!
Ich hab mir einen Header designt aus dem ich 5 einzelle Teile 50x50 ausgeschnitten hab, um diese im Headerbackground, als Buttons zu verwenden.
Ich habe jetzt nun nur keine Ahnung wie ich die Buttons so positionieren kann das sie nicht bei der Änderung der Auflösung verschoben werden sondern immer an der selben Position bleiben.
(ich positioniere mit 1024x768)
Deswegen arbeite ich leider generell noch immer mit Tabellen. Doch hier gibts keine Möglichkeit mit die Tabellen so auszurichten um die Buttons
korrekt übers header-img zu setzten das es was gleich schaut. Also hab ich mich bis jetzt dusslig probiert auch wenns schwachsinn war/ist.
also hier ist mal mein code hoffe irgendwer kann helfen!
mfg Robert
<style type="text/css">
#box1 { position:relative; top:-130px; left:134px;}
#box2 { position:relative; top:-130px; left:45px;}
#box3 { position:relative; top:-175px; left:50px;}
#box4 { position:relative; top:-158px; left:-20px;}
#box5 { position:relative; top:-165px; left:-18px;}
#box6 { position:relative; top:-130px; left:-35px;}
</style>
</head>
<table align="center">
<table>
<tr>
<td>
<img src="Header/head/hauptleiste.gif" border="0">
</td>
</tr>
</table>
<div id="box1"> <img src="Button/Hauptleiste/button1.gif" width="50" height="50" border="0"> </div>
<div id="box2"><a href="Infos.html"> <img src="Button/Hauptleiste/button2.gif" width="50" height="50" border="0"></a></div>
<div id="box3"><a href="stadt.html"> <img src="Button/Hauptleiste/button3.gif" width="50" height="50" border="0"></a></div>
<div id="box4"><a href="Sehenswertes.html"> <img src="Button/Hauptleiste/button7.gif" width="50" height="50" border="0"></a></div>
<div id="box5"><a href="Quiz.html"> <img src="Button/Hauptleiste/button5.gif" width="50" height="50" border="0"></a></div>
<div id="box6"><a href="Wir.html"> <img src="Button/Hauptleiste/button6.gif" width="50" height="50" border="0"></a></div>
oder
<style type="text/css">
body {
margin: 0;
padding: 0;
background-image: url(Header/Hauptleiste.gif);
background-repeat: no-repeat;
background-position: 50% 10px;
}
#box1 { position:absolute; left:290px; top:60px; width:150px; height:150px;}
#box2 { position:absolute; left:45px; top:-130px; width:100px; height:100px;}
</style>
</head>
<body bgcolor="4A8FD4">
<div id="box1"><a href="Neu.html"><img src="Button/button1.gif" width="50" height="50" border="0"></a></div>
<div id="box2"><a href="Infos.html"><img src="Button/button2.gif" width="50" height="50" border="0"></a></div>