Moin liebe html Community
im vorraus muss ich schoneinmal sagen, dass ich eigentlich noch ein ziemlicher Anfänger bin. (Ich mache html erst seit 3 Tagen :) ) Auf jeden Fall habe ich das Problem, dass der Text keinen automatischen Zeilenumbruch machen will, trotz, dass ich ihn mit den Tag <p> versehe.. Ich habe auch schon alles mögliche in CSS ausprobiert (Padding, margin etc.), jedoch kam ich zu keinem Ergebnis und längerer Text wurde somit über die ganze Seite angezeigt. Zudem sollte ich sagen, dass diese Seite selbstverständlich zum Üben ist und die dort genannte fiktive Firma nicht in echt existiert.
Quelltext (HTML):
Quelltext (CSS):
Ich hoffe das ist in Ordnung, dass ich den Code hier gepostet habe.
Ich bedanke mich schoneinmal für jede Antwort und vorallem für Verbesserungvorschläge! :)
Reboot21
im vorraus muss ich schoneinmal sagen, dass ich eigentlich noch ein ziemlicher Anfänger bin. (Ich mache html erst seit 3 Tagen :) ) Auf jeden Fall habe ich das Problem, dass der Text keinen automatischen Zeilenumbruch machen will, trotz, dass ich ihn mit den Tag <p> versehe.. Ich habe auch schon alles mögliche in CSS ausprobiert (Padding, margin etc.), jedoch kam ich zu keinem Ergebnis und längerer Text wurde somit über die ganze Seite angezeigt. Zudem sollte ich sagen, dass diese Seite selbstverständlich zum Üben ist und die dort genannte fiktive Firma nicht in echt existiert.
Quelltext (HTML):
HTML:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<link rel="stylesheet" href="style.css" type="text/css">
<title>Mehri Solutions - Startseite</title>
<link rel="icon" href="favicon.ico" type="image/x-icon">
</head>
<body>
<div id="header">
<p>Ihr Dienstleister für<br/> Informationstechnik</p>
</div>
<div id="nav">
<a href="#">Startseite</a>
<a href="#">Unsere Dienstleistungen</a>
<a href="#">Über Uns</a>
</div>
<div id="inhalt">
<h1>Test-Überschrift</h1>
<hr/>
<p>TestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTestTest</p>
</div>
<div id="footer">
<p>© Copyright Mehri Solutions GmbH. Alle Rechte vorbehalten</p>
<img src="img/facebook.png" alt="Besuchen Sie uns auf Facebook" style="margin-left: 435px" height="32" width="32">
<img src="img/twitter.png" alt="Besuchen Sie uns auf Twitter" height="32" width="32">
</div>
</body>
</html>
Quelltext (CSS):
Code:
@font-face { font-family: 'fedservice'; src: url('fonts/fedservice.ttf') format('truetype'); }
@font-face { font-family: 'fedservicelight'; src: url('fonts/fedservicelightcondital.ttf') format('truetype'); }
* {
margin: 0 auto;
padding: 0;
}
html, body {
width: 900px;
font: 100% Arial, Helvetica, sans-serif;
}
#header{
margin-top: 5px;
background:url(img/logo.png) no-repeat;
height: 145px;
}
#header p{
font-family: fedservice;
padding: 40px 0 0 270px;
font-size: 2.5em;
color: #DB0021;
}
#nav{
margin: 18px 0 18px 0;
padding-top: 5px;
background-color: #545454;
border-radius: 20px;
height: 30px;
text-align: center;
}
#nav a{
font-family: fedservicelight;
font-size: 20px;
padding: 0px 10px 0px 10px;
border: solid white 3px;
border-top-style: hidden;
border-bottom-style: hidden;
color: white;
font-weight: bold;
}
#inhalt{
padding: 10px 10px 10px 10px;
color: white;
background-color: #545454;
border-radius: 20px;
}
hr{
height: 20px;
visibility: hidden;
}
#inhalt h1{
text-align: center;
}
#inhalt p{
font-weight: bold;
}
#footer{
border-radius: 20px;
margin-top: 18px;
padding-top: 7px;
padding-bottom: 7px;
background-color: #545454;
}
#footer p{
height: 30px;
text-align: center;
font-weight: bold;
color: white;
}
Ich hoffe das ist in Ordnung, dass ich den Code hier gepostet habe.
Ich bedanke mich schoneinmal für jede Antwort und vorallem für Verbesserungvorschläge! :)
Reboot21