Hallo zusammen,
Ich bin recht neu in der XHTML und CSS Welt und muss gerade für mein Studium eine Website erstellen.
Ich habe das Buch von Michael Jendryschick durchgelesen und auch halbwegs verstanden (denke ich).
Jetzt habe ich allerdings mehrere Probleme und ich habe leider absolut keine Ahnung wie ich da weiterkomme.
Kurz zu meiner Umgebung:
Auflösung: 1920*1080
Die Website sieht so aus wie geplant, alles sitzt so wie ich wollte.
(Siehe Bild: h
ttp://www.bilder-hochladen.net/files/7it4-4-jpg.html)
Danach wollte ich die Website unetr der Auflösung 800*600 ansehen und musste feststellen, dass sie total verzogen ist.
(Siehe Bild:
http://www.bilder-hochladen.net/file...-5-jpg-nb.html )
Ich verstehe, dass es an der Auflösung liegt. Jetzt frage ich mich als Neuling nur:
Wie kriegen das andere Websites hin, dass diese in jeder Auflösung( und Fenstergröße ) gleich gut aussehen?
Wieso haut mir mein Content (bei den Bildern :"SCHÖN DASS SIE VORBEI SCHAUEN!) nach rechts ab, wenn ich eine kleinere Auflösung nehme ?
Wieso wird das Bild über dem Menüeintrag "Veranstaltungen" kleiner, aber nicht die anderen Teile der Website ?
Und zu guter letzt:
Ich habe schon nach meinem Fehler gegoogelt und habe gelesen, dass es wahrscheins daran liegt, dass ich
und
benutze.
In dem Beispiel meines Buches, nutzt Herr Jendryschick allerdings auch diese Angaben und bei ihm sieht die Website in jeder Auflösung gleichgut aus, was mache ich also falsch?
So, nach meinem ganzen Geschwalle kommt jetzt noch mein Code, da ihr mir ja sonst schlecht helfen könnt *g*.
Ausschnitt aus meiner Index.html:
HTML-Code:
<!-- Navigationsleiste oben -->
<div class="menu" [B]id="topm[/B]">
<ul>
<li class="zwischen"> <strong title="Hier befinden Sie sich gerade." id="start">Startseite</strong>
<!-- Navigationsleiste an der Seite -->
<div class="menu" [B]id="sidem"[/B]>
<ul>
<li><a href="Veranstaltungen.html">Veranstaltungen</a>
<!-- Hintergrund überhalb der Sidebar -->
<div id=[B]"log"[/B]></div>
<!-- Inhalt -->
<div id=[B]"content[/B]">
<h2>Schön, dass Sie vorbei schauen!</h2>
Inhalt meiner default.css (nur Ausschnitt für das Sidemenü!)
HTML-Code:
/**
* Länge auf 250 pixel setzen ( bündig mit dem image oben drüber)
* 1 pixel großer weißer Rand zwischen den einzelnen "Buttons"
* Text ausrichtung rechts.
*
*/
#sidem {
width: 250px;
background-color: #93d50d;
}
#sidem ul{
list-style: none;
margin: 0;
padding: 0;
}
#sidem a {
font: normal 100%/100% Georgia, Palatino, "Times New Roman", serif;
display: block;
border-width: 1px 0px 1px 0px;
border-style: solid;
border-color: #ffffff;
margin: 0; padding: 8px 12px;
text-align: right;
background: #fff;
}
#sidem a{
color: #93d50d;
text-decoration: none;
}
/**
* die ausgeklappten Puntke werden absolut an den Überpuntken positioniert
*
*/
#sidem li {
position: relative;
}
#sidem ul ul{
position: absolute;
top: 0%;
left: 100%;
width: 100%;
border-width: 0px 0px 0px 2px;
border-color: #ffffff;
border-style: solid;
}
Default.css Ausschnitt für Position
HTML-Code:
div#head {
width: 932px;
margin: auto;
position: relative;
}
#head h1 {
margin: 0;
padding: 0;
background: #EBE9DF url(pics/bg_logo.gif) left bottom no-repeat;
text-align: right;
}
/**
* @section Topmenü
*
*/
#topm ul {
position: absolute;
bottom: 80px;
left: 0px;
z-index: 2;
}
/**
* @section Sidemenü
*
*/
#sidem ul {
position: absolute;
margin: 0;
padding: 0;
text-align: right;
width: 250px;
top: 265px;
z-index: 2;
}
Oh mann, das ist ganz schön viel... ich weiß wieviel ich euch da zumute -.-
Hoffe aber trotzdem mir kann jemand helfen.
Allein schonmal fürs Durchlesen vielen Dank!
Gruß
Panama