Forum

Moin Leute,

bei meinem Problem handelt es sich darum, dass ich mehrere Custompages miteinander verlinken möchte, sprich das man auf eine Grafik klickt und dann auf eine andere Page kommt, was an sich kein Problem ist.

Mein Problem beruft sich auf die Grafiken in Form von Pfeilen die am Ende der Page angezeigt werden sollen.
Wollte ein Pfeil links, mittig und rechts angeordnet haben, die dann verlinkt sind zu anderen Custompages oder zum Seitenanfang.

Was ich nun eig nicht so ganz über html hinbekomme ist, dass die Pfeile in einer Zeile, sprich auf der selben Höhe platziert sind.
Ich weiß, dass man es mit dem "div"-tag machen kann, aber irgendwie waren da meine Versuche doch eher ein reinfall.
Habe es dann mal versucht einfach über eine Tabelle so zu gestalten aber irgendwie verschieben sich dort die spalten obwohl ich die Spaltenbreite fest definiert hatte.

Vielleicht habt ihr einen schönen Vorschlag und Tipps für mich

Vielen lieben Dank ^^

Hiho,

auch wenn wir das ganze schon per Live Support geklärt und gelöst haben, möchte ich hier der Vollständigkeit halber für alle Anderen die Lösung zeigen (mit Erklärungen):

Code: Select all

<div style="text-align: center;">


Zentriert alle Elemente innerhalb des DIV

Code: Select all

<div style="width: 70px; position: relative; top: 20px; vertical-align: middle; display: inline-block; float: left;"><a href="LINK ZUR VORIGEN SEITE"> <img src="../files/pfeillinks.png" alt="" height="70px"></a></div>


schiebt das Bild nach links

Code: Select all

<div style="position: relative; top: 10px; width: 70px; vertical-align: middle; display: inline-block;"><a href="#ID DES ERSTEN DIVS AUF DER SEITE"> <img src="../files/pfeilhoch.png" alt="" height="70px"></a>
<p><span style="font-size: xx-small;">Seitenanfang</span></p>
</div>


Keine Positionsangabe -> bleibt zentriert (link nach oben)

Code: Select all

<div style="width: 70px; position: relative; top: 20px; vertical-align: middle; display: inline-block; float: right;"><a href="LINK ZUR NÄCHSTEN SEITE"> <img src="../files/pfeilrechts.png" alt="" width="70px"></a>
</div>

nach rechts geschoben

Code: Select all

</div>

schliesst das erste DIV


Nochmal zusammen:

Code: Select all

<div style="text-align: center;">
<div style="width: 70px; position: relative; top: 20px; vertical-align: middle; display: inline-block; float: left;"><a href="LINK ZUR VORIGEN SEITE"> <img src="../files/pfeillinks.png" alt="" height="70px"></a></div>
<div style="position: relative; top: 10px; width: 70px; vertical-align: middle; display: inline-block;"><a href="#ID DES ERSTEN DIV"> <img src="../files/pfeilhoch.png" alt="" height="70px"></a>
<p><span style="font-size: xx-small;">Seitenanfang</span></p>
</div>
<div style="width: 70px; position: relative; top: 20px; vertical-align: middle; display: inline-block; float: right;"><a href="LINK ZUR NÄCHSTEN SEITE"> <img src="../files/pfeilrechts.png" alt="" width="70px"></a>
</div>
</div>

MfG Yenky