Ankündigung

Einklappen
Keine Ankündigung bisher.

[Erledigt] Problem mit CSS Layout

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • [Erledigt] Problem mit CSS Layout

    Hi,

    ich bin gerade dabei ein CSS Layout zu erstellen. Leider habe ich ein paar Fehler drinne und weiß nciht wo.
    Also, es wir im IE richtig angezeigt aber in Firefox nicht. Beim Firefox steht das Menü so weit rechts, das man nicht mal die Listenpunkte sieht.
    Außerdem ist das Menü im Textinhalt drinne. Was muss ich ändern, das es nicht mehr so ist?

    Zweite Sache:
    Wie kann ich das Komplette Layout von rechts in die mitte hohlen, ohne das die Schrft dann auch zentriert ist?
    Und wie mache ich es, dass das Menü dierekt am content dran ist ohne abstand?

    hier mein code:
    Code:
    <!doctype html public "-//W3C//DTD HTML 4.0//EN">
    <html>
    <head>
      <title>Test Layout</title>
      <style type="text/css">
             #menue
             {
              width:100px;
              color:red;
              border:1px ridge #cecece;
              float:left;
             }
             #content
             {
              width:600px;
              color:blue;
              border:1px ridge #dedede;
              float:center;
             }
      </style>
    </head>
    <body>
    <div width="700px" style="margin:0px;">
         <div id="menue">[*]Hallo[*]Hallo[*]Hallo[*]Hallo[*]Hallo
         </div>
         <div id="content">
              <h3>Hallo</h3>
    
    
    
              shdjksdfjhdsjkfhkjsdfhjkh
    
              sehjksdfhjksdhfkjhsdjkfhsdjk
    
              sdahkjdshfjkhdskfjhsdkjfkjsdf
    
         </div>
    </div>
    </body>
    </html>


  • #2
    also float:center schaut etwas falsch aus, gib das mal weg

    Kommentar


    • #3
      <!doctype html public "-//W3C//DTD HTML 4.0//EN">
      Die Zeile ist eigentlich auch Schrott, sorry, aber die ist unvollständig.
      Vieleicht etwas zum lesen:
      http://www.carsten-protsch.de/zwisch...ype/index.html

      Kommentar


      • #4
        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"
        <head>
          <title>Test Layout</title>
          <style type="text/css">
                 #menue
                 {
                  width:100px;
                  color:red;
                  border:1px ridge #cecece;
                  float:left;
                 }
                 #content
                 {
                  width:600px;
                  color:blue;
                  border:1px ridge #dedede;
                 }
          </style>
        </head>
        <body>
        <div width="700px" style="margin:0px;">
             <div id="menue">[*]Hallo[*]Hallo[*]Hallo[*]Hallo[*]Hallo
             </div>
             <div id="content">
                  <h3>Hallo</h3>
        
        
        
                  shdjksdfjhdsjkfhkjsdfhjkh
        
                  sehjksdfhjksdhfkjhsdjkfhsdjk
        
                  sdahkjdshfjkhdskfjhsdkjfkjsdf
        
             </div>
        </div>
        </body>
        </html>
        so sieht jetzt mein Quellcode aus, aber die Seite wird immer noch nicht im Center angezeigt, und das Menü ist immer noch im Textfluss.

        Kommentar


        • #5
          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">
           
           
           <head> 
             <title>Test Layout</title> 
             <style type="text/css"> 
             	.center{
             		text-align:center;
             	}
             	.main{
             		width:600px; 
             		margin:0px auto;
             	}
             	.content 
          		{ 
          			color:blue; 
          			border:1px solid #000000; 
          		} 
          		.menue 
          		{ 
          			width:100px; 
          			color:red; 
          			border:1px ridge #000000; 
          			float:left; 
          			padding:5px;
          			margin:3px;
          		} 
          		
             </style> 
           </head> 
           
           <body> 
           <div class="center">
           	<div class="main"> 
            	<div class="menue"> 
          			[*]Hallo 
          			[*]Hallo 
          			[*]Hallo 
          			[*]Hallo 
          			[*]Hallo 
               </div> 
               <div class="content"> 
          			<h3>Hallo</h3>
          			
          
          
          				shdjksdfjhdsjkfhkjsdfhjkh
           
          				sehjksdfhjksdhfkjhsdjkfhsdjk
           
          				sdahkjdshfjkhdskfjhsdkjfkjsdf
           
          			</p>
               </div> 
           	</div> 
           </div>
           
           </body> 
           </html>
          hi malte,

          so sollte es mit linux und windows funktionieren.
          viel spass damit.

          gruss, malaga

          Kommentar


          • #6
            und malte,

            so sollte ein vernünftiger kopf in etwa aussehen!!!

            Code:
            <?xml version="1.0" encoding="iso-8859-1"?>
            
            <!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>
            	<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" />
            	<title>...</title> 
            	<meta name="description" content="..." />
            	<meta name="keywords" content="..." />
            	<meta name="Abstract" content="..." />
            	<meta name="page-topic" content="..." />
            	<meta name="publisher" content="..." />
            	<meta name="copyright" content="..." />
            	<meta name="Page-type" content="..." />
            	<meta name="Classification" content="..." />
            	<meta name="distribution" content="..." />
            	<meta name="content-language" content="German -Deutsch -de -ch -at " />
            	<meta name="robots" content="index -follow -all -alle" />
            	<meta name="modified" content="..." />
            	<meta name="revisit-after" content="1 days" />
            	<meta name="audience" content="Alle,all" />
            	<meta name="Generator" content="Vim 6.3 for Linux" />
            	<meta http-equiv="imagetoolbar" content="no" />
            	<base href="http://...." />
            	<link href="....." rel="stylesheet" type="text/css" />
            </head>

            Kommentar

            Lädt...
            X