Dickes Problem, andere Foren sind erfolglos.
- Ersteller Shrax
- Erstellt am
- Status
Danke hat geklappt^^
Nur eines Stimmt noch nicht.
Das Design sollte sich aber nicht KOmmplett wiederholen, sondern nur der Letzte Bereich. So wie du es gesagt hast wiederholt sich ja oben der Bannerstreifen auch mit.
Und schon hab ich wieder ein neues Problem!
Hoffetich Nerve ich euch nicht.
Die Navigation will einfach nicht neben den Text.
Jetzt hab ich die Navigation Richtig jetzt ist der Text weit Unten.
css
Nur eines Stimmt noch nicht.
Das Design sollte sich aber nicht KOmmplett wiederholen, sondern nur der Letzte Bereich. So wie du es gesagt hast wiederholt sich ja oben der Bannerstreifen auch mit.
Und schon hab ich wieder ein neues Problem!
Hoffetich Nerve ich euch nicht.
Die Navigation will einfach nicht neben den Text.
Jetzt hab ich die Navigation Richtig jetzt ist der Text weit Unten.
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>Titel</title>
<link rel="stylesheet" href="design.css" type="text/css" />
<meta http-equiv="expires" content="0" />
<meta name="robots" content="all" />
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="description" content="Das Portal für Gamer, Webmaster, Computer FReaks und Mehr." />
<meta name="author" content="Daniel K." />
<meta name="keywords" content="Games, Webmaster, Home-Anwender, Computer, Internet" />
<meta name="generator" content="Webocton - Scriptly" />
<meta http-equiv="content-language" content="de" />
<meta http-equiv="cache-control" content="no-cache" />
</head>
<body>
<div id="seite" />
<div id="kopfbereich">
<h1>
Daniel`s Internet Porta
</h1>
</div>
<div id="steuerung">
<ul>
<li><a href="index.htm">Home</a> </li>
<li><a href="impressum.htm">Impressum</a></li>
<li><a href="Disclaimer.htm">disclaimer</a></li>
<li><a href="http://www.onlyfree.de/cgi-bin/viscacha/user/8728/book.cgi">Guestebuch
</a></li>
</ul>
</div>
<div id="inhalt">
<h1>Willkommen</h1>
<p>Ich freue mich sie hier, in meinem Internet Portal Willkommen zu heißen.</p>
Hier werden ihnen nicht nur Tipps und Infos vor die Füße geklatscht,
nein ihnen wird auch Erklährt um was es Dabei geht!
In diesem Portal finden sie Infos zu verschiedenen Bereichen!
<ul>
<li>Games</li>
<li>Webmaster</li>
<li>Home-Anwender</li>
<li>Internet</li>
<li>Computer</li>
</ul>
<p id="abstand"> Na, noch nicht so Richtig Überzeugt? <br /></p>
<p>Sie wollen nicht Wissen wie sie ihren Computer fit halten?</p>
<p>Wie sie am besten Viren und Trojaner abwehren?</p>
<p>Oder, vieleicht suchen sie eine bestimmte Abkürzung in der Chatsprache?</p>
<p>Das und vieles mehr könnten sie auf den Nächten Seiten Erfahren!</p>
</div>
<p id="fussbereich">
Copyright 2008-2010 by Daniel Kreiter
</p>
</body>
</html>
Code:
body {
font : 100.01% Verdana, Arial, Helvetica, sans-serif;
}
* {
margin : 0;
padding : 0;
}
#seite {
width : 990px;
margin : 0 auto;
}
#kopfbereich {
padding : 20px;
}
#inhalt {
margin-right : 500px;
margin-top : 10px;
padding : 10px;
}
ul {
margin-left : 30px;
margin-top : 20px;
}
#abstand {
margin-left : 10px;
margin-top : 10px;
}
#steuerung {
margin-left : 810px;
margin-top : 40px;
padding : 40px;
}
#fussbereich {
clear : both;
padding : 20px;
}
body {
float:left;
background-image: url(Template.png);
background-repeat: repeat;
}
Zuletzt bearbeitet von einem Moderator:
E
Efchen
Guest
Ja. So wird aus dem Nichts eine Überschrift und ein Textabsatz. Fast alles ist besser, als ein <div>, das nichts weiter aussagt!
Was ist <p id="seite"></p>? Ein Textabsatz ohne Textinhalt? Da kann was nicht stimmen.
Wozu <div id="steuerung"> um die Navigation? Du gruppierst doch nichts, hast doch nur eine Liste. Warum nicht <ul id="steuerung">?
Die <h1>Willkommen</h1> würde ich in h2 umwandeln. h1, als Überschrift erster Ordnung, ist für mich der Titel der Site, das was Du oben als #kopfbereich ausgezeichnet hast. Dann können weitere Überschriften nur noch untergeordneter Ordnung sein.
Der Text "In diesem Portal finden sie Infos zu verschiedenen Bereichen!" ist nicht ausgezeichnet.
Im <p id="abstand"> Na, noch nicht so Richtig Überzeugt? <br /></p> würde ich zum einen die ID anders wählen. Niemals Namen, die sich aufs Layout beziehen, sondern auf den Inhalt. Auch das ist Trennung von Inhalt und Layout. Besonders schlimm ists, wenn man ein Element "links" nennt. Was macht man dann, wenn man das irgendwann mal auf die rechte Seite packen will?
Außerdem ist das <br /> hier drin wohl eher unsinnig.
Die Tipps, die dann da kommen, könnte man auch als Liste auszeichnen, es ist schließlich auch eine Art Auflistung.
Ggruß,
-Efchen
Erstmal Danke für die Antworten^^
Hab diese Tage Leider einiges zu tun.
Werde mich mal mit dem Float schlau machen und den Code nach den Tipps
ausbessern, kann allerdings etwas dauern , 1-3 Tage.
Dan melde ich mich wieder und Poste das Ergebniss :>
So.
Ich Denke nun ist es Zeit dieses Projekt woran ich gearbeitet habe zu Löschen und mit meiner Wirklichen Website anzufangen.
Als erstes werde ich mir ein Schönes Design machen und dan Stück für Stück
den Inhalt, Texte und Html css.
Ich hoffe ich kann hier weiterhin Nachfragen.
Mein HTML Code Bisher:
Und CSS
Hi
Ich bins wieder.
sry für 3fach Post aber sonst lest es keiner mehr.
Neue Frage aufgetaucht;
Wie mache ich es das eine Linkliste von Links nach rechts anzeigt und nicht von oben nach unten?
Hab diese Tage Leider einiges zu tun.
Werde mich mal mit dem Float schlau machen und den Code nach den Tipps
ausbessern, kann allerdings etwas dauern , 1-3 Tage.
Dan melde ich mich wieder und Poste das Ergebniss :>
So.
Ich Denke nun ist es Zeit dieses Projekt woran ich gearbeitet habe zu Löschen und mit meiner Wirklichen Website anzufangen.
Als erstes werde ich mir ein Schönes Design machen und dan Stück für Stück
den Inhalt, Texte und Html css.
Ich hoffe ich kann hier weiterhin Nachfragen.
Mein HTML Code Bisher:
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de">
<head>
<title>Titel</title>
<link rel="stylesheet" href="design.css" type="text/css" />
<meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
<meta name="description" content="" />
<meta name="author" content="Daniel K." />
<meta name="keywords" content="Games, Webmaster, Home-Anwender, Computer, Internet" />
<meta name="generator" content="Webocton - Scriptly" />
</head>
<body>
<h1 id="kopfbereich">
Daniel`s Internet Portal
</h1>
<div id="steuerung">
<ul>
<li><a href="index.htm">Home</a> </li>
<li><a href="impressum.htm">Impressum</a></li>
<li><a href="Disclaimer.htm">disclaimer</a></li>
<li><a href="http://www.onlyfree.de/cgi-bin/viscacha/user/8728/book.cgi">Guestebuch
</a></li>
</ul>
</div>
<div id="inhalt">
<h2>Willkommen</h2>
<p>Ich freue mich sie hier, in meinem Internet Portal Willkommen zu heißen.</p>
<p>Hier werden ihnen nicht nur Tipps und Infos vor die Füße geklatscht,
nein ihnen wird auch Erklährt um was es Dabei geht!
In diesem Portal finden sie Infos zu verschiedenen Bereichen!</p>
<ul>
<li>Games</li>
<li>Webmaster</li>
<li>Home-Anwender</li>
<li>Internet</li>
<li>Computer</li>
</ul>
<p id="weiter"> Na, noch nicht so Richtig Überzeugt? </p>
<ul>
<li>Sie wollen nicht Wissen wie sie ihren Computer fit halten?</li>
<li>Wie sie am besten Viren und Trojaner abwehren?</li>
<li>Oder, vieleicht suchen sie eine bestimmte Abkürzung in der Chatsprachen</li>
<li>Das und vieles mehr könnten sie auf den Nächten Seiten Erfahren!</li>
</ul>
</div>
</body>
</html>Und CSS
Code:
body {
font : 100.01% Verdana, Arial, Helvetica, sans-serif;
}
* {
margin : 0;
padding : 0;
}
#kopfbereich {
padding : 20px;
}
#inhalt {
float: left;
width:40%;
margin-left: 200px;
margin-right: 5px;
margin-top: 100px
}
ul {
margin-left : 30px;
margin-top : 20px;
}
#weiter {
margin-left : 10px;
margin-top : 10px;
}
#steuerung {
float: right;
width:13%;
margin-left: 10px;
margin-right: 20px;
margin-top: 90px
}
body {
background-image: url(Template.png);
background-repeat: repeat;
}Ich bins wieder.
sry für 3fach Post aber sonst lest es keiner mehr.
Neue Frage aufgetaucht;
Wie mache ich es das eine Linkliste von Links nach rechts anzeigt und nicht von oben nach unten?
Zuletzt bearbeitet von einem Moderator:
E
Efchen
Guest
"CSS Horizontales Menu" in Google eingeben :-)
Das geht, indem Du die einzelnen Listenelemente entweder floatest oder ihnen die Eigenschaft display:inline verpasst.
Das geht, indem Du die einzelnen Listenelemente entweder floatest oder ihnen die Eigenschaft display:inline verpasst.
Sooooo^^
Bis jetzt sind keine Probleme mehr aufgetaucht die Google nicht lösen konnte ;)
Danke, habs jetzt so ziemlich hin bekommen.
In Geschäzt 2 Monaten wird meine Homepage Online gehen. Hier ein kleines Screenhot, wie meine Leistungen bis jetzt sind. Bin zwar noch anfänger aber finde es bis jetzt ganz Toll.
Den Text hab ich rausediert da die Website eigentlich erst beim release gezeigt werden soll.
http://img391.imageshack.us/img391/3638/screenshot001kopiefx0.jpg
Bis jetzt sind keine Probleme mehr aufgetaucht die Google nicht lösen konnte ;)
Danke, habs jetzt so ziemlich hin bekommen.
In Geschäzt 2 Monaten wird meine Homepage Online gehen. Hier ein kleines Screenhot, wie meine Leistungen bis jetzt sind. Bin zwar noch anfänger aber finde es bis jetzt ganz Toll.
Den Text hab ich rausediert da die Website eigentlich erst beim release gezeigt werden soll.
http://img391.imageshack.us/img391/3638/screenshot001kopiefx0.jpg
Wollte einfach nur mal rausposaunen das meine erste Selbergeschriebe HP nun bald (in grob 2 Monaten) erscheinen wird und das ich fleißg dran arbeite und dazu Lerne.
Wenn die Website Online ist stell ich sie in das Richtige Forum für Kritik^^
Soo
Meine Homepage ist Fleißig in Arbeit. Zur probe habe ich das jetzt Schonmal auf Funpic Hochgeladen.
Vor vorne Weg:
Sie ist noch nicht fertig, bitte keine Kritik ausüben oder Rechtschreibfehler usw.
Allein vollgendes Problem beschäftigt mich seit einiger Zeit.
In internet Explorer 7 Wird alles Wunderbar Angezeigt. Im Firefox allerdings wird der Text UNTER der Navigation angezeigt anstatt daneben.
Bis auf einzelne Scripts von Anbietern für Newsletter ist der Komplette Code Valid.
Hier die CSS Datei:
Und alles andere steht im Quellentext:
Daniel K Internet Portal
Wenn die Website Online ist stell ich sie in das Richtige Forum für Kritik^^
Soo
Meine Homepage ist Fleißig in Arbeit. Zur probe habe ich das jetzt Schonmal auf Funpic Hochgeladen.
Vor vorne Weg:
Sie ist noch nicht fertig, bitte keine Kritik ausüben oder Rechtschreibfehler usw.
Allein vollgendes Problem beschäftigt mich seit einiger Zeit.
In internet Explorer 7 Wird alles Wunderbar Angezeigt. Im Firefox allerdings wird der Text UNTER der Navigation angezeigt anstatt daneben.
Bis auf einzelne Scripts von Anbietern für Newsletter ist der Komplette Code Valid.
Hier die CSS Datei:
Code:
body {
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size:15px;
color:black;
}
body {
background-image: url(gedanke_und_erinnerung.png);
background-repeat: no-repeat;
}
body { color:black; }
a:link { color:black; }
a:visited { color:#FF9900; }
a:active { color:blue; }
#navi {
text-align:left; /* Textausrichtung */
margin-top:10px; /* Außenabstand oben */
margin-bottom:10px; /* Außenabstand unten */
margin-left:20px; /* Außenabstand links */
margin-right:15px; /* Außenabstand rechts */
}
#navi ul {
list-style:none; /* keine Aufzählungspunkte */
}
#navi li {
float:left; /* Anordnung links */
margin-left:15px; /* Außenabstand oben */
width:90px; /* Breite des Links */
background-color:silver; /* Hintergrundfarbe */
border-top:1px black solid; /* Rahmenfarbe Auflistungpunkt oben */
border-left:25px orange solid; /* Rahmenfarbe Auflistungpunkt oben */
border-bottom:1px red solid; /* Rahmenfarbe unten */
border-right:2px blue solid; /* Rahmenfarbe unten */
margin-top:290px; /* Außenabstand oben */
padding-top:8px; /* Innenabstand oben */
padding-bottom:8px; /* Innenabstand unten */
padding-left:8px; /* Innenabstand unten */
padding-right:8px; /* Innenabstand unten */
}
#steuerung {
border-width: 10px;
border-style: ridge;
border-color: Yellow;
float: left;
clear:both;
margin-left: 30px;
margin-top: 10px;
margin-right: 30px;
}
#inhalt {
float: right;
clear:both;
margin-left: 0px;
margin-right: 60px;
margin-top: 0px
}Daniel K Internet Portal
Zuletzt bearbeitet von einem Moderator:
Ups gar nicht gemerkt :O
Habs geändert.
Zu meiner Frage, ich selber denke das ich mit den floats was falsch gemacht habe die haben mir einige Probleme Bereitet, vill. könnte das ja sein^^
Öhm... Push
Nur zur erinnerung die Frage ist auf der Vorletzten Seite.
Vieleicht sieht das nur niemand im moment xD
Habs geändert.
Zu meiner Frage, ich selber denke das ich mit den floats was falsch gemacht habe die haben mir einige Probleme Bereitet, vill. könnte das ja sein^^
Öhm... Push
Nur zur erinnerung die Frage ist auf der Vorletzten Seite.
Vieleicht sieht das nur niemand im moment xD
Zuletzt bearbeitet von einem Moderator:
Hurrican schrieb:
Tatsächlich? ;)
IE 7 (eigentlich 8 Beta, aber 7 wird emuliert)
Ein kleiner Verbesserungsvorschlag:
In CSS kannst du vieles zusammenfassen, wie zum Beispiel:
Code:
body {
font-family : Verdana, Arial, Helvetica, sans-serif;
font-size:15px;
color:black;
}
[COLOR=Red]body {
font:15px Verdana, Arial, Helvetica, sans-serif;
color:black;
}[/COLOR]
Code:
body {
background-image: url(gedanke_und_erinnerung.png);
background-repeat: no-repeat;
}
[COLOR=Red]body {
background:url(gedanke_und_erinnerung.png) no-repeat;
}[/COLOR]
Code:
#navi {
text-align:left; /* Textausrichtung */
margin-top:10px; /* Außenabstand oben */
margin-bottom:10px; /* Außenabstand unten */
margin-left:20px; /* Außenabstand links */
margin-right:15px; /* Außenabstand rechts */
}
[COLOR=Red]#navi {
margin:10px 15px 10px 20px;
text-align:left;
}[/COLOR]
Code:
#navi li {
float:left; /* Anordnung links */
margin-left:15px; /* Außenabstand oben */
width:90px; /* Breite des Links */
background-color:silver; /* Hintergrundfarbe */
border-top:1px black solid; /* Rahmenfarbe Auflistungpunkt oben */
border-left:25px orange solid; /* Rahmenfarbe Auflistungpunkt oben */
border-bottom:1px red solid; /* Rahmenfarbe unten */
border-right:2px blue solid; /* Rahmenfarbe unten */
margin-top:290px; /* Außenabstand oben */
padding-top:8px; /* Innenabstand oben */
padding-bottom:8px; /* Innenabstand unten */
padding-left:8px; /* Innenabstand unten */
padding-right:8px; /* Innenabstand unten */
}
[COLOR=Red]#navi li {
width:90px;
float:left;
margin:290px 0px 0px 15px;
padding:8px;
border-top:1px black solid;
border-bottom:1px red solid;
border-left:25px orange solid;
border-right:2px blue solid;
background:silver;
}[/COLOR]
Code:
#steuerung {
border-width: 10px;
border-style: ridge;
border-color: Yellow;
float: left;
clear:both;
margin-left: 30px;
margin-top: 10px;
margin-right: 30px;
}
[COLOR=Red]#steuerung {
float:left; /* kein clear:both;! */
margin:10px 30px 0px 30px;
border:10px ridge yellow;
}[/COLOR]
Code:
#inhalt {
float: right;
clear:both;
margin-left: 0px;
margin-right: 60px;
margin-top: 0px
}
[COLOR=Red]#inhalt {
float:left; /* kein float:right; und clear:both;! */
margin-right:60px;
}[/COLOR]Bei größeren oder kleineren Viewports macht deine Website Probleme. Das liegt daran, dass du ein Bild (http://istudio.is.funpic.de/gedanke_und_erinnerung.png) als Layout & Design verwendest. Dadurch entstehen auch andere Probleme (vor allem beim Positionieren) und insgesamt wird es für dich schwieriger, den Überblick zu behalten.
Xmicha
Neues Mitglied
Keine ahnung was die anderen haben aber egal 
.
Ich war (bin immer noch) bei oyla.
Ist eig nicht schlecht da aber mann ist begrenzt.
Für dein Endless design ist eine Sache von 1 sec. xD
Oyla hat ne support seite auch wenn das wenige wissen dort findest du in Schritten wie du deine Hp erstellst.
Hab so auch HTML gelernt was besserers giebts net.
Aber egal kommen wa zu deiner sache Endless design ::arrow:Oyla - Homepagehilfe
Und bei den 2en findest du die lösung auch hier ;-)
.Ich war (bin immer noch) bei oyla.
Ist eig nicht schlecht da aber mann ist begrenzt.
Für dein Endless design ist eine Sache von 1 sec. xD
Oyla hat ne support seite auch wenn das wenige wissen dort findest du in Schritten wie du deine Hp erstellst.
Hab so auch HTML gelernt was besserers giebts net.
Aber egal kommen wa zu deiner sache Endless design ::arrow:Oyla - Homepagehilfe
Und bei den 2en findest du die lösung auch hier ;-)
- Status
