• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

2 Probleme

Status
Für weitere Antworten geschlossen.
K

Kemikal

Neues Mitglied
2 Probleme [Gelöst]

Hallo meine Navi will net so wie ich nach rechts habe ich sie bekommen aber nicht nach unten.

Screen
Screen.bmp.png



Kompletter HTML Code
Code: 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Unbenanntes Dokument</title>
<link href="CSS/style.css" rel="stylesheet" type="text/css" />
<link href="CSS/Navi.css" rel="stylesheet" type="text/css" />
<link href="CSS/Content.css" rel="stylesheet" type="text/css" />
<link href="CSS/Fill.css" rel="stylesheet" type="text/css" />
</head>
<body>
<img src="Images/_02.gif"  class="header" /> 
<img src="Images/_04.gif"  class="header_leiste" /> 
<img src="Images/Fill.gif" class="fill_1" /> 
<img src="Images/Fill.gif" class="fill_2" /> 
<img src="Images/Fill.gif" class="fill_3" /> 
<img src="Images/Fill.gif" class="fill_4" /> 
<img src="Images/Content.gif"  class="content" />
<div class="div_content">Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.   
  
  Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse molestie consequat, vel illum dolore eu feugiat nulla facilisis at vero eros et accumsan et iusto odio dignissim qui blandit praesent luptatum zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum dolor sit amet,</div>
<div id="divNaviLeft"> 
<img src="Images/_05.gif" border="0" />
<img src="Images/_14.gif" border="0" />
<img src="Images/_16.gif" border="0" />
<img src="Images/_18.gif" border="0" />
<img src="Images/_21.gif" border="0" />
<img src="Images/_23.gif" border="0" />
<img src="Images/_24.gif" border="0" />
<img src="Images/_25.gif" border="0" />
<img src="Images/_26.gif" border="0" />
<img src="Images/_27.gif" border="0" />
<img src="Images/_28.gif" border="0" />
<img src="Images/_29.gif" border="0" />
<img src="Images/_30.gif" border="0" />
<img src="Images/_31.gif" border="0" />
<img src="Images/_32.gif" border="0" />
</div>

<div>
<img src="Images/_13.gif"  class="user" />
<img src="Images/_15.gif"  class="user_box" />
<img src="Images/_17.gif"  class="pass" />
<img src="Images/_20.gif"  class="pass_box" />
</div>

<img src="Images/Right Content.gif"  class="right_content" /> 
<img src="Images/Footer.gif" border="0"  class="footer"/>
</body>
</html>
HTML Code der Navigation
Code: 
<div id="divNaviLeft"> 
<img src="Images/05.gif" border="0" />
<img src="Images/14.gif" border="0" />
<img src="Images/16.gif" border="0" />
<img src="Images/18.gif" border="0" />
<img src="Images/21.gif" border="0" />
<img src="Images/23.gif" border="0" />
<img src="Images/24.gif" border="0" />
<img src="Images/25.gif" border="0" />
<img src="Images/26.gif" border="0" />
<img src="Images/27.gif" border="0" />
<img src="Images/28.gif" border="0" />
<img src="Images/29.gif" border="0" />
<img src="Images/30.gif" border="0" />
<img src="Images/31.gif" border="0" />
<img src="Images/32.gif" border="0" />
</div>
CSS
Code: 
div#divNaviLeft ul li {
    display: block;
}
div#divNaviLeft ul li a {
    display: block;
}
div#divNaviLeft img {
    margin-left:262px;
    display: block;
}
Und wie kann ich es machen das die Seite auf jeder Auflösung gleich aussieht ???

Vielen Dank
 
Zuletzt bearbeitet:
Also in deinem Quellcode sehe ich weder eine ungeordnete Liste (<ul>) noch irgendwelche Listenpunkte (<li>) geschweige denn irgendwelche Links, daher meine Frage: Wiso taucht das bei dir im CSS auf? Eine Möglichkeit die die hast:

Gebe dem DIV "divNaviLeft" eine feste Breite, floatiere den Linksbündig und rücke ihm mit margin-left vom linken Rand weg. Dann schmeiss noch die margin-left Angabe für deine Bildchen im CSS raus. Sollte soweit funzen.

Im Übrigen - ich will mal hoffen, dass der Quellcode nicht so bleibt wie er jetzt ist (Bilder ohne alt, title, width und height Angaben). So schön das auch aussehen mag - Es geht auf Kosten der Accessibility und Usability und bei dir artet das momentan auf eine extrem eingeschränkte Accessibility bzw. Usability aus.

MfG

NewLord
 
Also CSS sieht nun so aus

Code: 
.NaviLeft ul li {
    display: block;
    width:160px;
    margin-left:222px;
}
.NaviLeft ul li a {
    display: block;
}
.NaviLeft img {
    display: block;
}

und HTML so

Code: 
<div class="NaviLeft"> 
<ul>
<li><img src="Images/Warez_05.gif" border="0" /></li>
<li><img src="Images/Warez_14.gif" border="0" /></li>
<li><img src="Images/Warez_16.gif" border="0" /></li>
<li><img src="Images/Warez_18.gif" border="0" /></li>
<li><img src="Images/Warez_21.gif" border="0" /></li>
<li><img src="Images/Warez_23.gif" border="0" /></li>
<li><img src="Images/Warez_24.gif" border="0" /></li>
<li><img src="Images/Warez_25.gif" border="0" /></li>
<li><img src="Images/Warez_26.gif" border="0" /></li>
<li><img src="Images/Warez_27.gif" border="0" /></li>
<li><img src="Images/Warez_28.gif" border="0" /></li>
<li><img src="Images/Warez_29.gif" border="0" /></li>
<li><img src="Images/Warez_30.gif" border="0" /></li>
<li><img src="Images/Warez_31.gif" border="0" /></li>
<li><img src="Images/Warez_32.gif" border="0" /></li>
</ul>
</div>

Das Float Left habe ich weggenommen weil es net gefuntz hat [vllt auch an die Falsche stelle getan:D]

Funtzen tut es aber net sieht genau wie vorher aus
 
Status
Für weitere Antworten geschlossen.

Neueste Beiträge

Zurück
Oben