Du befindest Dich im Archiv vom ABAKUS Online Marketing Forum. Hier kannst Du Dich für das Forum mit den aktuellen Beiträgen registrieren.

Menue / LIste, statt untereinander nebeneinander

Ajax, Hijax, Microformats, RDF, Markup, HTML, PHP, CSS, MySQL, htaccess, robots.txt, CGI, Java, Javascript usw.
Neues Thema Antworten
BlueMonday
PostRank 1
PostRank 1
Beiträge: 4
Registriert: 13.04.2009, 17:49

Beitrag von BlueMonday » 13.04.2009, 18:02

Ich schaffs einfach nicht die Links nebeneinander zu setzten.
Im Mozilla sieht man gar nichts mehr, im IE ist die Liste noch da, aber nur der Hintergrund hat sich verbreitert.

Ich weiss nich was da verkehrt sein soll.

Die Seite hat noch keine Domain, so hab ich beides gezippt und hier eingehängt, wo mans entpackt sollte egal sein.



Code: Alles auswählen

	 		
      body
		{ 
		position:absolute;			
		}

		html, body
		{ 
			top:0; left:0; right:0;
			min-height:100%;
			background:#0000DD;
			margin:0;
			padding:0;
			width:100%;
		}
		
		#headerCont 
		{
			position:fixed;
			top:0; left:0; right:0;
			text-align:center;
			margin:0;			
			height:3em;
			z-index:3;			
		}
		
		#header
		{
			position:absolute;
			top:0; left:0; right:0; bottom:0;
			height:100%;
			background:#0000DD;
			z-index:3;
			margin:0;
			padding:0.2em;
			FONT-FAMILY: Arial, Tahoma, 'Sans-serif'
			font-size:1.5em;
			color: #44565C;
		}


		a.menu{	display:block		
			top:1.5em;
			left:1.6em;
			height:1.6em;			
			width:52em;
			text-decoration: none;			
			background-color:#ffffff;			
			z-index:3 }	
		

			a.menu:link    { color:#00f; background-color:ffffff; }
			a.menu:visited { color:#00f; background-color:ffffff; }
			a.menu:hover   { color:#ff0; background-color:#00f; }
			a.menu:active  { color:#ff0; background-color:#a03; }	

		
		
		#content
		{
			margin:0;
			padding-top:4.85em;
			padding-left:3.0em;
			padding-bottom:9em;
			width:45em;
			z-index:2;			
			color: #0000DD;
						
		} 	
		
		#footerCont
		{
			position:fixed;
			bottom:0; left:0; right:0;
			text-align:center;
			margin:0;
			height:3em;
			z-index:3;
		}
		
		#footer 
		{
		    	position:absolute;
		    	top:0; left:0; right:0; bottom:0;
		    	height:100%;
		    	background:#0000DD;		    
		    	FONT-FAMILY: Arial, Tahoma, 'Sans-serif'
			font-size:0.8em;
			color:#000000;
			z-index:3;
		}
		
		/* Nun für den MSIE */
		* html, * html body 
		{
			overflow:hidden;
			bottom:0;
			height:100%;
		}
		
		* html #header_container, * html #footer_container
		{
			position:absolute;
			width:100%;
			padding-right:16px;
		}
		
		* html #menu
		{
			position:absolute;
		}
		
		* html #header,* html #footer
		{
			height:100%;
			position:static;
		}

		* html #content 
		{
			position:absolute;
			top:0; bottom:0; left:0; right:0;
			height:100%;
			width:100%;
			overflow:auto;
			margin:0;			
		}

ENDE CSS

Code: Alles auswählen

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">
	<title>TestListe</title>

<link rel="stylesheet" type="text/css" href="CSSFormate.css">
		

	
</head>

<body>
	
	<div id="headerCont">
			
		<h1 id="header">OBEN</h1>
	
	</div>	

	

	
	
	<div class="menu">
			<a class="menu" href="index.htm">Home</a>
			<a class="menu" href="extras/index.htm">Extras</a>
			<a class="menu" href="links/index.htm">Links</a>
			<a class="menu" href="mailto&#58;name@domain.de">E-Mail</a>
	</div>


<div id="content">
		



<table border="0" width="830" height="75"  cellspacing="0" cellpadding="0">       
        
      <colgroup>   
        <col width="220">
        <col width="610">
        <col width="10">
     </colgroup>

    <tr>      
      <td bgcolor="#00D500"></td>
      <td bgcolor="#00D500">MITTE</td>
      <td bgcolor="#00D500"></td>
    </tr>    
          
</table>

</div>
	
<div id="footerCont">
	<div id="footer">
			<br><b>UNTEN</b>

	
	</div>
	</div>




</body>
</html>

Anzeige von ABAKUS

von Anzeige von ABAKUS »


Hochwertiger Linkaufbau bei ABAKUS:
  • Google-konformer Linkaufbau
  • nachhaltiges Ranking
  • Linkbuilding Angebote zu fairen Preisen
  • internationale Backlinks
Wir bieten Beratung und Umsetzung.
Jetzt anfragen: 0511 / 300325-0

TBT
PostRank 5
PostRank 5
Beiträge: 306
Registriert: 13.02.2008, 16:11

Beitrag von TBT » 13.04.2009, 19:25

mach eine Liste mit ul und li aus dem Menü div, und floate die li's

Sensei
PostRank 6
PostRank 6
Beiträge: 436
Registriert: 24.01.2009, 13:56
Wohnort: Hannover

Beitrag von Sensei » 13.04.2009, 21:28

TBT hat geschrieben:mach eine Liste mit ul und li aus dem Menü div, und floate die li's
hatte mich schon gewundert warum ich in dem Code keine Liste gesehen habe :D

kannst du ul in den meisten Fällen auch mit floaten, musst natürlich selber wissen, ob sich das auf dein design eventuell doch auswirken könnte.

Anzeige von ABAKUS

von Anzeige von ABAKUS »

Content Erstellung von ABAKUS Internet Marketing
Ihre Vorteile:
  • einzigartige Texte
  • suchmaschinenoptimierte Inhalte
  • eine sinnvolle Content-Strategie
  • Beratung und Umsetzung
Jetzt anfragen: 0511 / 300325-0

BlueMonday
PostRank 1
PostRank 1
Beiträge: 4
Registriert: 13.04.2009, 17:49

Beitrag von BlueMonday » 13.04.2009, 22:01

Mit CSS HTML hab ich nicht so viel zu tun.

Was "li" angeht sowas kenn ich z.B. so

Code: Alles auswählen

<li><a class="menu" href="index.htm">Home</a></li>
			<li><a class="menu" href="extras/index.htm">Extras</a></li>
			<li><a class="menu" href="links/index.htm">Links</a></li>
			<li><a class="menu" href="mailto&#58;name@domain.de">E-Mail</a></li>
Wo es im CSS Code gesetzt werden kann, weiss ich nicht.
ICh habe Varianten, in denen es verwendet wird, aber eine horizontale Liste liess sich damit nicht machen.

BlueMonday
PostRank 1
PostRank 1
Beiträge: 4
Registriert: 13.04.2009, 17:49

Beitrag von BlueMonday » 13.04.2009, 22:07

Ich nochmal, hab im CSS Code einfach Li statt menu, schon gehts.
Wär aber trotzdem froh, wenn einer von euch sich nochmal kurz meldet

Beim Googln hatte ich mit li nähmlich nichts gefunden, nur diese a.menu

so siehts jetzt so aus:

Code: Alles auswählen

<div class="li">
			<a class="menu" href="index.htm">Home</a>
			<a class="menu" href="extras/index.htm">Extras</a>
			<a class="menu" href="links/index.htm">Links</a>
			<a class="menu" href="mailto&#58;name@domain.de">E-Mail</a>
	</div>


CSS

Code: Alles auswählen

a.li&#123;	display&#58;block		
			top&#58;1.5em;
			left&#58;1.6em;
			height&#58;1.6em;			
			width&#58;52em;
			text-decoration&#58; none;			
			background-color&#58;#ffffff;			
			z-index&#58;3 &#125;

		
		

			a.li&#58;link    &#123; color&#58;#00f; background-color&#58;ffffff; &#125;
			a.li&#58;visited &#123; color&#58;#00f; background-color&#58;ffffff; &#125;
			a.li&#58;hover   &#123; color&#58;#ff0; background-color&#58;#00f; &#125;
			a.li&#58;active  &#123; color&#58;#ff0; background-color&#58;#a03; &#125;	

Nullpointer
PostRank 10
PostRank 10
Beiträge: 4790
Registriert: 22.04.2005, 19:14
Wohnort: West Berlin

Beitrag von Nullpointer » 14.04.2009, 08:32

wenn du wirklich was lernen willst, schau dir diese seite an:
https://www.cssplay.co.uk/

(bei verwendung des codes die zugehörige lizenz beachten)

BlueMonday
PostRank 1
PostRank 1
Beiträge: 4
Registriert: 13.04.2009, 17:49

Beitrag von BlueMonday » 14.04.2009, 20:08

Oh ja, ich will das ganz doll viel lernen!
Und nu, stehst du mir mit Rat und Tat zur Seite, ja?

Is immer dieselbe Grütze, je tiefer das Niveau, der jeweiligen Sprache, desto grösser die Wahrscheinlichkeit solche Typen wie dich anzutrefen, die so richtig am Knopf drehen.

Mir fällt altkanzler Schmidt ein:" Geheimdienste sind Männer, denen viel abverlangt wird, denen aber keine Annerkennung Zuteil wird, denn sie müssen ja geheim bleiben. Das deformiert die Seele".

Ja, lieber Nullp, hat die Welt immer noch nicht begriffen, dass HTML/CSS was ganz doll Schwieriges is... und was man da alles wissen muss..

Noch n'bischen durchhalten, wird schon

e-fee
PostRank 10
PostRank 10
Beiträge: 3893
Registriert: 08.05.2007, 12:53

Beitrag von e-fee » 15.04.2009, 00:16

Wie wäre es beispielsweise damit, das display:block durch display:inline zu ersetzen, anstatt als bloody Newbie hier im Forum direkt mal verbal in die Scheiße zu greifen?
Denn mit Block-Elementen iss nich viel gebacken mit floaten ... wobei ich ja immer noch kein float in Deinem Code gesehen habe, nachdem das hier jemand erwähnt hat.
Nun gut, die Dinger stehen jetzt einfach deshalb nebeneinander, weil die Eigenschaft display:block jetzt zum umgebenden div gehört, die a-Elemente aber von Natur aus inline-Elemente sind. Das war aber jetzt 'n reiner Zufallstreffer und nicht die mit "li" gemeinte Lösung! Wobei vermutlich die ganze restliche Formatierung der Links futsch ist, da es ein a.li im eigentlichen Dokument ja gar nicht mehr gibt.

Also entweder du setzt dich wenigstens mal ein bisschen mit den CSS-Grundlagen auseinander (scheint ja reinstes Copy&Paste zu sein), ich kann da nichts Verwerfliches am Vorschlag von Nullpointer erkennen, oder Du stehst beim nächsten Problem wieder hier und stellst 'ne mehr oder minder doofe Frage.

HTML/CSS ist auch nichts Schwieriges, aber für Dich anscheinend ja schon, und je nachdem, was man umsetzen will, KANN es schon mal was kniffliger werden.

Network
PostRank 3
PostRank 3
Beiträge: 96
Registriert: 28.01.2004, 08:13
Wohnort: Allgäu

Beitrag von Network » 15.04.2009, 06:13


Nullpointer
PostRank 10
PostRank 10
Beiträge: 4790
Registriert: 22.04.2005, 19:14
Wohnort: West Berlin

Beitrag von Nullpointer » 15.04.2009, 08:16

Network hat geschrieben:Beispiele findest du hier
https://css.maxdesign.com.au/listamatic ... ntal01.htm
ob seine deformierte seele das verdauen kann? :lol:

heino
PostRank 8
PostRank 8
Beiträge: 833
Registriert: 21.09.2006, 13:42

Beitrag von heino » 15.04.2009, 12:05

BlueMonday hat geschrieben:Oh ja, ich will das ganz doll viel lernen!
Und nu, stehst du mir mit Rat und Tat zur Seite, ja?

Is immer dieselbe Grütze, je tiefer das Niveau, der jeweiligen Sprache, desto grösser die Wahrscheinlichkeit solche Typen wie dich anzutrefen, die so richtig am Knopf drehen.

Mir fällt altkanzler Schmidt ein:" Geheimdienste sind Männer, denen viel abverlangt wird, denen aber keine Annerkennung Zuteil wird, denn sie müssen ja geheim bleiben. Das deformiert die Seele".

Ja, lieber Nullp, hat die Welt immer noch nicht begriffen, dass HTML/CSS was ganz doll Schwieriges is... und was man da alles wissen muss..

Noch n'bischen durchhalten, wird schon
BlueMonday du solltest dich bei einem HTML oder CSS Forum registrieren, damit du dich mit Leuten deines Niveaus austauschen kannst.

Antworten
  • Vergleichbare Themen
    Antworten
    Zugriffe
    Letzter Beitrag