Icons nebeneinander und verlinken

html.de-Forum HTML, XHTML & CSS
1

Hallo Leute!

Ich hätte wieder eine kleine Frage und zwar wie bekomme ich 5 icons nebeneinander in der mitte mit einem hyperlink?

greetz

2

Hallo,

das kommt auf deine Seite an. Hast du mal einen Link?

Gruss

MrMurphy

3

Ich mache das ganze Local , aber sie können es sich in diesem Thread ansehen im 3en Beitrag habe ich ein Bild gepostet.

http://www.html.de/threads/ein-paar-fragen.52817/#post-361043

4

Hallö,
In den ein link um das Bild machst und den link per css display:inline-Block gibst.

Cheffchen

5

Funktioniert nicht recht , ich habe irgendeinen wirrwar drinnen .

HTML:
[HTML]

<meta charset="utf-8" />                                                       <!-- Codierung -->
<title>Enterpage V1.0</title>                                                   <!-- Titel-->
                                                                               <!-- Verlinkungen-->
    <link rel="stylesheet" href= "stylesheet.css" >
    <link rel="animation" href= "jscript.js" >
    <link rel="icon" href="icons/favicon.png" type="image/png" />               <!-- Favicon Definieren-->

    <center><img src="images/logo.png" id="logo"></a></center>

    <center><a href="http://sa-mp.de"><img src="icons/forum.png"  id="forum"></a></center>
    <center><a href="http://deingame.de"><img src="icons/game.png"    id="game"></a></center>
    <center><a href="http://deinteamspeak.de"><img src="icons/teamspeak.png"    id="ts"></a></center>
    <center><a href="http://deincontrolpanel.de"><img src="icons/controlpanel.png"    id="cp"></a></center>
[/HTML]

Css:

[CODE]tml, body {
background:url(images/Bild1.png);

margin: 0;
padding: 0;
overflow: hidden;

}

#enter{
display:inline-block
}

#logo{
width: 50%;
height: 50%;
}

#forum {
width: 12%;
height: 12%;
}

#game{
width: 12%;
height: 12%;
}

#ts{
width: 12%;
height: 12%;
}

#cp{
width: 12%;
height: 12%;
}[/CODE]

6

Dein HTML-Code ist ziemlich kaputt. Da ist ein zuviel im header, und ist nicht zulässig (und an der Stelle auch falsch angebracht). Zudem ist dein CSS-Code fehlerhaft (tml statt html) und du hast nicht auf das gehört was dir zuletzt bzgl. display: inline-block geraten wurde.

7

Vielen Dank druch die ganze löschung der center , steht das nun alles nebeneinander.

http://up.picr.de/19228875jj.jpg

Zu deinem rat , ich habe doch dies geschrieben

#enter{ display:inline-block }

Passt das denn nicht? Ich bin gerade ziemlich verwirrt :smiley:

Vielen Dank für deine Hilfe !

8

(Hervorhebung von mir)

9

Ok danke , wie richte ich diese Objekte nun mittig aus ?

10

Ein

text-align: center;

beim umgebenden Element sollte helfen.