Ergebnis 1 bis 3 von 3

Thema: Layout Probleme

  1. #1
    HTML Newbie
    Registriert seit
    19.02.2008
    Beiträge
    2
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard Layout Probleme

    Hallo Leute,

    habe irgendwie mit meinen erstellten Layout ein Problem, dass der Text aus der "Textebene" aus dem kompletten Layout einfach so hinausläuft. bin irgendwie ratlos und weiß nicht woran es liegen könnte.

    Wundert euch nicht über die länge der CSS-Datei is die vollständige CSS für das Layout. Hab leider auch noch nicht alles bestens sortieren können, hoffe ihr kommt zurecht.

    CSS:

    Code:
    /* --------- Allgemeines ---------- */
    
    * { margin: 0; padding: 0; }
    
    body {
            background: url(img/background.gif) top left repeat;
         }
    
    
    h1 {
          font-size: 24px;
    	  font-family: Georgia, "Times New Roman", Times, serif;
       }
    
    
    /* ---------- Container ----------- */
    
    #wrapper {
                 margin: 0 auto;
    			 width: 870px;
    			 padding: 0;
    			 border-left: 1px solid #999999;
    			 border-right: 1px solid #999999;
    			 border-bottom: 1px solid #999999;
             }
    
    
    
    
    /* ------------ oberer Bereich ----------- */
    
    #oben  {
              height: 20px;
    		  background: #fff url(img/oben.gif);
    		  border-bottom: 1px solid #999999;
           }
    
    
    /* ----------- Header-Bereich ------------ */
    
    #header {
               height: 120px;
    		   background: #f3f3f3;
    		   margin: 0;
    		   padding: 0;
    		   border-bottom: 1px solid #999999;
            }
    
    
    #logo {
             float: left;
    		 width: 162px;
    		 height: 120px;
    		 background: url(img/logo.jpg);
    		 margin: 0;
    		 padding: 0;
    	  }
    
    
    #title {
              float: left;
              width: 400px;
    		  height: 50px;
    		  font-size: 24px;
    		  /*border: 1px solid #000;*/
    		  margin-top: 45px;
    		  /*padding-left: 15px;*/
           }
    	   
    .slogan {
              padding-top: 5px;
    		  font-size: 20px;
    		  padding-left: 45px;
    		  font-style: italic;
            }
    
    
    /* ------------ Navigation 1 ------------- */
    
    
    .nav1 {
              float: right;
    		  margin-top: 15px;
    		  margin-right: 15px;
    		  padding: 0;
          }
    
    
    .nav1 ul {
               margin: 0;
    		   padding: 0;
    		   list-style: none;
             }
    		 
    .nav1 li {
                display: inline;
    			margin: 0;
    			padding: 0;
             }
    
    .nav1 li a {
                 display: inline;
    			 font-size: 9pt;
    			 color: #666666;
    			 padding-left: 5px;
    			 padding-right: 5px;
    			 text-decoration: none;
    			 border-left: 1px solid #999999;
    			 border-right: 1px solid #999999;
               }
    
    .nav1 a:hover {
                     color: #000;
    				 font-weight: bold;
    				 text-decoration: underline;
    			  }
    
    
    /* -------------- Navigation 2 -----------------------*/
    
    .nav2 {
             float: left;
    		 width: 200px;
    		 margin: 15px 15px;
    		 border: 1px solid #999999;
          }
    
    .nav2 ul {
                margin: 0;
    			padding: 0;
    			list-style: none;
             }
     
    .nav2 li {
               display: block;
    	   	   margin: 0;
    		   padding: 0;
    		   background-repeat: no-repeat;
             }
    
    .nav2 li.menukopf {
    					color: #fff;
    					height: 20px;
    					background-color: rgb(115,0,24);
    					font-size: 14px;
    					line-height: 21px;
    					padding-left: 20px;
    					text-transform:uppercase;
                      }
    
    .nav2 li a {
                 display: block;
    			 color: #000;
    		     /*background-color: #d9d9d9;*/
    			 background-color: #efeeee;
    			 background-image: url(img/arrow.gif);
    			 background-repeat: no-repeat;
    			 background-position: 0 -28px;
    			 padding: 3px 0px 3px 20px;
    			 text-decoration: none;
               }
    
    .nav2 a:hover {
                     /*background-color: #fff; */
    				 background-image: url(img/arrow.gif);
    				 background-repeat: no-repeat;
    				 background-position: 0 8px;
    				 text-decoration: none;
    				 /*border-bottom: 1px solid #999999;*/
                  }
    
    
    
    /* ------------------ Navigation 2 Formular ---------------------------- */
    
    
    .nav2 li form     {
                         margin-top: 10px;
                         margin-left: 20px;
    					 margin-bottom: 15px;
                      }
    
    
    .fields {
              border: 1px solid #999999;
            }
    
    
    
    #loginbutton {
                    margin: 0;
    				padding: 0;
                 }
    
    #formlink {
                 color: #000;
    			 font-size: 12px;
    			 background: none;
    			 margin: 0;
    			 padding: 0;
              }
    
    
    
    /* -------------- Menu-Container ---------------------*/
    		  
    #menu_container {
     
                       width: 870px;
    				   min-height: 500px;
    				   background-color: #fff;
                    }
    
    
    /* --------------- Nav Container -------------------- */
    
    #navcontainer {
                     float: left;
    				 width: 200px;
    				 height: auto;
    				 margin: 0;
    				 padding: 0;
                  }
    
    
    
    /* ----------------- Content  ------------------------ */
    
    #content {
                float: left;
    			margin-top: 15px;
    			padding-left: 50px;
    			padding-right: 20px;
    		 }
    			
    
    /* -------------- Footer ---------------------------- */
    
    
    #footer {
                float: left;
    			clear: left;
                width: 870px;
    			height: 40px;
    			color: #fff;
    			background-color: rgb(115,0,24);
    			font-size: 11pt;
    			text-align: center;
    			line-height: 40px;
            }

    HTML:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http&#58;//www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Meine Homepage</title>
    
    <link rel="stylesheet" type="text/css" href="style.css" />
    
    </head>
    
    <body>
    
    <div id="wrapper">
      
      <div id="oben"></div>
      
      <div id="header">
        
        <div id="logo"></div>
    	<div id="title">Ihre Firmenname
    	<div class="slogan">Ihr Slogan</div>
    	</div>
        
    	<div class="nav1">
    	<ul>[*]Startseite[*]Kontakt[*]Impressum[/list]
        </div> 
    
      </div> 
    
      <div id="menu_container">
    
       
         <div id="navcontainer">
            
            <div class="nav2">
    	    <ul>
    	    <li class="menukopf">Menu
    	[*]Startseite
    	[*]Registrierung
    	[*]Produktkatalog
    	[*]AGB
    	[*]FAQ
    	[*]Impressum
    	[/list]
    			
    	    <ul>
    	    <li class="menukopf">Login
    		[*]
               <form class="loginbox" method="post" action="">
    		   <label>Benutzername&#58;</label><input class="fields" type="text" name="benutzer"  />
    		   <label>Passwort&#58;</label><input class="fields" type="password" name="passwort" />
    		   Passwort vergessen?
    		   <input type="submit" id="loginbutton" name="Submit" value="Login" />
    		   </form>
            
    	[/list]
    	    
    		</div> 
    		
    	 </div> 
     
    	 <div id="content">
    	  
    	 <h1>WillkommenWillkommen</h1>
    	 
    
    &fdsdfjapofjasopfjopasdjfölkasjfölkasjfkölshflöshdfklshadfölkasfklöhsdföklashfkölhsadfklsadlöfksklöfhsdalfhasöklhföklashdfkölashdflöhföklshdaflönbsp;</p>
    	 
    
    </p>
    	 
    	 </div>
    	   
      </div>   
      
      <div id="footer">copyright @ 2008 by Ihr Firmenname</div>
      
    <br style="clear&#58; both;" />
    
    </div> 
    
    </body>
    </html>

    Hoffe ihr könnt mir weiterhelfen, dass der Text dann wenn er zulange ist auf der nächste Zeile weitergeführt wird. Bin schon recht verzweifelt, da dass Layout schon kurz vor der Auslieferung steht.

    PS:
    Wenn jemand noch ein paar IE 6 Hacks hat oder so wäre ich euch sehr dankbar, da ich MS Vista habe und es somit auf dem IE 6 nicht testen konnte.


    Mit freundlichen Grüßen
    Christian
    Achtung: Dies ist ein alter Thread im HTML und Webmaster Forum
    Diese Diskussion ist älter als 90 Tage. Die darin enthaltenen Informationen sind möglicherweise nicht mehr aktuell. Erstelle bitte zu deiner Frage ein neues Thema im Forum !!!!!

  2. #2
    Forum Guru Avatar von driver
    Registriert seit
    10.04.2006
    Alter
    34
    Beiträge
    20.729
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    du schreibst doch selten einen text wo ein wort über 50 zeichen hat, oder ?
    mach zu deinen "fadfsafsa" einfach mal irgendwo ein leerzeichen rein.
    dann sollte der text auch gebrochen werden...
    >> die icq-schreiberlinge bitte dies hier beachten



    1679 entdeckte Gottfried Wilhelm Leibniz das Binärsystem, bei einem Gespräch mit seiner Mutter: "Ja..., Nein..., Nein..., Nein..., Ja..., Ja..., Nein..."

  3. #3
    HTML Newbie
    Themenstarter

    Registriert seit
    19.02.2008
    Beiträge
    2
    Danke
    0
    Bekam 0 mal "Danke" in 0 Postings

    Standard

    Hallo druver,

    danke. Das war zwar nicht die direkte Lösung zu meinen Problem, aber genau nachdem ich es gelesen hatte ist mir die Lösung eingefallen. Habe content wie folgt geändert.

    CSS:
    Code:
    #content &#123;
    			margin-top&#58; 15px;
    			padding-left&#58; 230px;
    			padding-right&#58; 50px;
    		 &#125;
    Nochmals vielen Dank

    Gruß
    Christian

Ähnliche Themen

  1. Tabellen-Layout in DIV-Layout umändern...
    Von Peter_Pan im Forum HTML & CSS Forum
    Antworten: 16
    Letzter Beitrag: 22.03.2007, 21:29
  2. Ich habe layout probleme:(..beim ie
    Von gast im Forum HTML & CSS Forum
    Antworten: 8
    Letzter Beitrag: 02.09.2006, 16:07
  3. Probleme bei meinem Layout
    Von Sibirische im Forum Forum für Grafiken und Bildbearbeitung
    Antworten: 10
    Letzter Beitrag: 05.10.2005, 16:53
  4. Layout
    Von Help_me-lol im Forum HTML & CSS Forum
    Antworten: 3
    Letzter Beitrag: 23.01.2005, 00:29
  5. Layout
    Von McMetzger im Forum HTML & CSS Forum
    Antworten: 4
    Letzter Beitrag: 15.08.2004, 23:17

Stichworte

Berechtigungen

  • Neue Themen erstellen: Nein
  • Themen beantworten: Nein
  • Anhänge hochladen: Nein
  • Beiträge bearbeiten: Nein
  •