div boxen feststellen

kappilino

Hi,

Ich habe ein menue gebaut und es funktioniert alles auch soweit so gut. Wenn ich die Seite aber zusammen schiebe wandern die ganzen menüpunkte von oben nach links.

Wie kann ich das verhindern. Ich möchte gerne das das menü immer oben bleibt.

Die einzelnen menü punkte kann ich mit margin irgendwie nicht platzieren. funktioniert nicht. Warum auch immer.

Quelltext:

HTML

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">


<html>


	<head>
		<meta http-equiv="content-type" content="text/html;charset=iso-8859-1">
		<meta name="generator" content="Adobe GoLive">
		<title>Unbenannte Seite</title>
		<link href="file:///D:/Eigene%20Dateien/Eigene%20Dokumente/Eigene%20Dokumente/Website/blackbox/blackbox.css" rel="stylesheet" type="text/css" media="all">
	</head>


	<body bgcolor="#ffffff">
	  <div>
		<ul class="navi1">
		  <li id="graunav1">
		  <li id="menue1">[url='']HOME[/url]
		  <li id="menue2">[url='']PROJEKTE[/url]
		  <li id="menue3">[url='']PROFIL[/url]
		  <li id="menue4">[url='']TEAM[/url]
		  <li id="menue5">[url='']COMMUNITY[/url]
		  <li id="graunav2">	
		[/list]</div>
	</body>


</html>

Alles anzeigen

und hier die css:

Code

.navi1 {
margin: 0px 0px 0px 0px;
 }


#menue1   { 
float: left;
color: #fff; 
font-size: 0.9em; 
font-family: Tahoma; 
font-weight: 600; 
text-decoration: none; 
background-color: 6B6B6B; 
text-align: center; 
width: 114px; 
height: 19px; 
border-bottom: 1px solid #000000; 
border-left: 1px solid #fff;
}


#menue1 a:link {
font-size: 0.9em;
font-family: Tahoma;
font-weight: 600;
color: #fff; 
text-decoration: none;
background-color: #6B6B6B; 
text-align: center; 
width: 114px; 
height: 19px;
}


#menue1 a:hover {
font-size: 0.9em;
font-family: Tahoma;
font-weight: 600;
color: #fff; 
text-decoration: none;
background-color: #000; 
text-align: center; 
width: 114px; 
height: 19px;
}


#menue1 a:visited {
color: #fff;
text-decoration: none;
font-size: 0.9em;
height: 19px;
width: 114px; 
}

Alles anzeigen

Das ist nur der style für den ersten menü punkt. Die anderen sind aber genau identisch.

Vielen Dank im Voraus für eure Hilfe

isaBERLIN

das geht mit "position: fixed;"

füge in dein stylesheet ein :

Code

.menudiv {
position: fixed;
}

und dann in dein <div> Tag :

Code

<div class="menudiv">

weiterhin solltest du deinen stylsheet-link relativieren :

Code

<link href="blackbox/blackbox.css" rel="stylesheet" type="text/css" media="all">

wenn die html in dem ordner "Website" liegt.
Sonst bekommst du später beim hochladen probleme ---

kappilino

Das funktioniert irgendwie nicht. Die divs wandern immer noch nach links weck.

isaBERLIN

Hast du mal nen link zu der homapeg ? ist so schwer zu sagen was du meinst

kappilino

Ne, die ist ja noch ganz am anfang der Entwicklung.

Aber ich kann das hier so in etwa darstellen. Vielleicht hilft das.

Also das ist das normale menü:

menü menü menü menü menü menü

Wenn ich die Seite nun zusammenschiebe dann wandert das menü nach links etwa so.

menü
menü
menü
menü
menü

Ich möchte aber einfach das es so stehen bleibt wie das erste Bespiel. Wie kann ich das umsetzen ?

isaBERLIN

das liegt daran das divs sich anpassen an die page (dynamisch)
wenn jetzt der browser kleiner wird als das div, verschiebt es sich natürlich so das immernoch sein gesamter inhalt zu sehen ist ...

ändern kannst du es indem du dem div feste breite und höhe zuweist ...
z.B.

Code

.menudiv {
width: 200px;
height: 50px;
}

kappilino

Funktioniert =)

Hab Dank für deine Hilfe =)))

Tags