Text ausrichten

html.de-Forum HTML, XHTML & CSS
1

Hey Leute :slight_smile:
und zwar habe ich folgendes Problem:
Ich möchte gerne auf meiner Seite einen Text unter diese 3 Logos packen:
http://puu.sh/dCttD/b999d949a6.jpg
Wie jedoch zu erkennen ist hängt der Text irgendwo zwischen dem „T-Time“ und den Logos.
Hier mein Quelltext:
[HTML]

html, body { background-image:url(/Bilder/Bild2.png); background-size: cover; background-position: 0 0; background-repeat: no-repeat; background-attachment: fixed; font-family: 'Roboto', sans-serif; 
            }
            .überschrift {
                vertical-align: top;
            }  
            IMG.FBlogo    {
                margin-top: 200px;
                margin-left: 23%;
                margin-right: auto;
                float: left;
            }
            IMG.YTlogo    {
                margin-top: 190px;
                margin-left: auto;
                margin-right: auto;
                float: left;
            }  
            IMG.IGlogo    {
                margin-top: 200px;
                margin-left: auto;
                margin-right: auto;
                float: left;  
            }  
            IMG.banner    {
                margin-top: 500px;
                margin-left: 0 auto;
                border: 0;
                overflow:hidden;
                position: relative;
            }      
              
            .text {
                position: relative;
                margin-top: 1000px;
            }
        </style>
    <title>T-Time HANNES</title>
</head>
<body>  
    <div id="überschrift" align="center">
        <a href="http://bit.ly/1sYAjQ0" target="_blank"> <img src="/Bilder/t-time.png" alt="T-Time" width="850px" height="190px" href="www.youtube.de/user/ttimevlog"></a>
    </div>
        <a href="http://on.fb.me/1qMbTVp" target="_blank"> <img class="FBlogo" src="/Bilder/FB.png" alt="Facebook.de/ttimevlog" width="320px" height="320px" align="center"></a>
            <a href="http://bit.ly/1sYAjQ0" target="_blank"> <img class="YTlogo" src="/Bilder/YT.png" alt="T-Time" width="340px" height="340px" align="center"></a>
            <a href="http://bit.ly/1zPONlM" target="_blank"> <img class="IGlogo" src="/Bilder/IG.png" alt="Instagram" width="320px" height="320px" align="center"></a>
        <!--<img class="banner" src="/Bilder/banner.png" alt="banner" align="left" height="300" width="1920">    -->  
            <div>
            <p id="text" >Dies ist ein Test Text. Er dient nur zum Test </br>
                    Dieser Text hat nichts zu bedeuten und ist dumm. haha!</p>
                    </div>
</body>
[/HTML] Nun zu meiner Frage: [U][B]Wie bekomme ich diesen Text UNTER die 3 Logos? [/B][/U] LG Hannes PS: Ihr könnt euch die Seite gerne auch "live und in Farbe" ansehen: [hannes-lernen.t-time.ws]('http://hannes-lernen.t-time.ws')
2

Korrigiere zunächst mal deinen HTML-Code:
http://validator.w3.org/check?verbose=1&uri=http%3A%2F%2Fhannes-lernen.t-time.ws%2F

Achte zudem darauf, dass Du für IDs keine Sonderzeichen verwendest. Das kann zu Problemen führen.

Die Links solltest Du mit einem Wrapper umgeben dem Du die Eigenschaft overflow: hidden; gibst. Dadurch wird das floating der Elemente beendet und der Text kann danach angezeigt werden.
Alternativ dazu kannst Du auch die Links statt mit float mit display: inline-block; nebeneinander positionieren.

3

Du weist gar nicht wie sehr ich mich gerade gefreut habe als dieser verdammte Text UNTER den Logos hing.
Vielen dank