DIVs nebeneinander, linke DIV verschiebt Inhalt der rechten

Voltex

Mitglied
Hallo Community,
seit ich mein letztes Problem gelöst habe, habe ich ein neues. Ich habe nun 2 Spalten nebeneinander. Seltsamerweise scheint die Linke Spalte den Inhalt der Rechten zu verschieben obwohl diese garnicht breit genug dafür ist. ein Screenshot ist angehangen.

Folgendes wollte ich Fragen: Würde sich jemand bereit erklären den Code mal anzuschauen? Die Wichtigen Auszüge hier zu Posten würde schätzungsweise den Rahmen sprengen.

so far,
Christian
 

Anhänge

  • mycom.jpg
    mycom.jpg
    76,7 KB · Aufrufe: 70
Also ne seite "Online" gibts noch nicht dafür. Läuft bisher alles lokal auf meinem Server. Hab aber das aktuelle nochmal zusammengepackt und angehangen. Passwort ist das gleiche wie beim letzten Mal. Wichtig sind die index_test.php und default_test.css (im Ordner "template").

so far,
Christian

EDIT: Oh, Dam.. Ich hab wieder vergessen die PHP Tags rauszunehmen... -.-

Hier der Code Ohne Tags

HTML:
<?xml version="1.0" encoding=""?><!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" xml:lang="de" lang="de">                                   
  <head>                                                              
    <title>MyCOM | Startseite                                                            
    </title>                                                              
    <meta http-equiv="content-style-type" content="text/css" />                                                              
    <meta http-equiv="content-script-type" content="text/javascript" />                                                              
    <meta http-equiv="content-language" content="de" />                                                              
    <meta http-equiv="expires" content="0" />	                                                               
    <meta name="page-topic" content="MyCOM | www.ion-light.de" />                                                              
    <meta name="description" content="MyCOM | www.ion-light.de" />                                                              
    <meta name="keywords" content="MyCOM | www.ion-light.de" />                                                              
    <meta name="generator" content="MyCOM | http://www.mycom.ion-light.de (c) 2009 - all rights reserved" />                                                              
    <meta name="author" content="MyCOM | http://www.mycom.ion-light.de (c) 2009 - all rights reserved" />                                                              
    <meta name="robots" content="index, follow" />	                                                               
    <link rel="stylesheet" type="text/css" href="template/default_test.css" />                                      
  </head>                                   
  <body>                                                           
    <div id="header">     Testseite                                                          
    </div>                                                           
    <div id="topnavileftcorner">                                                           
    </div>                                                           
    <div id="topnavileftborder">                                                           
    </div>                                                           
    <div id="topnavitoolbar"><h2>                                                                                                           
        <a href="index.php" class="a1">Startseite</a> |                                                                                                            
        <a href="index.php?news=1" class="a1">News</a> |                                                                                                            
        <a href="index.php?impres=1" class="a1">Impressum</a> |                                                                                                            
        <a href="index.php?agb=1" class="a1">AGBs</a> |                                                                                                            
        <a href="index_test.php?version=1" class="a1">Versionshinweise</a> |                                                                                                            
        <a href="http://www.ion-light.de" class="a1">Bugtracker</a></h2>                                                           
    </div>                                                           
    <div id="topnavirightborder">                                                           
    </div>                                                           
    <div id="topnavirightcorner">                                                           
    </div>                                                           
    <div id="advert-lefttop">                                                           
    </div>                                                           
    <div id="advert-leftbottom">                                                           
    </div>                                                           
    <div id="advert-righttop">                                                           
    </div>                                                           
    <div id="advert">
<a href="http://my.opera.com/community/download.pl?ref=Angel-of-Retribution&p=opera_desktop" target="_blank"><img src="http://promote.opera.com/opera9/468x60opera9.gif" alt="Opera, the fastest and most beautiful browser on the planet. download now"></a>                                                           
    </div>                                                           
    <div id="advert-rightbottom">                                                           
    </div>                                                           
    <div id="advert-right">                                                           
    </div>                          
    <div id="wrapper" class="clearfix">                
      <div id="usernavi">                            
        <form action="index_test.php?page=login" method="post">                     
          <div id="loginbar">                       
          </div>	                      
          <div id="boxcontent">   	   	
 	  	                          
            <!-- default start -->   	  	                          
            <div>  	  	                                
              <div id="loginuser">                                 
                <table border="0">                                     
                  <td valign="middle">                                         
                    <input class="login" type="text" name="username" value="" class="login" /></td>                                 
                </table>                             
              </div>	    	                              
              <div id="loginpass">                                 
                <table border="0">                                     
                  <td valign="middle">                                         
                    <input class="login" type="password" name="password" value="" /></td>                                 
                </table>                             
              </div>	    	                              
              <input class="loginbt" type="submit" name="sender" value="" />	 	  	                          
            </div>	  	                          
            <a href="register.php">              
              <img class="registerbt"></a>	  	                          
            <!-- default end -->  	  	
   	                      
          </div>  	              
      </div>                                
    <div id="mainarea">
    <div id="content-topbar">               
          <div id="ctopbarl">          
          </div>               
          <div id="ctopbarc"><h2>Content</h2>          
          </div>               
          <div id="ctopbarr">          
          </div>           
        </div>  
             
        <div id="frame-topbar">               
          <div id="ftopbarl">          
          </div>               
          <div id="ftopbarc"><h2>
<p>MyCOM Versionsinfo<br /></h2>          
          </div>               
          <div id="ftopbarr">          
          </div>           
        </div>             
        <div id="boxcontentbig">        
Frontend: v0.0.6<br />
build: #16 <br />
Codename: Annemarie
<br />
<br />
Backend: v0.0.8<br />
build: #28</p>
<hr />
<h5><span>Changelog</span></h5>
<p>&nbsp;</p>
<p><strong>v0.0.6 #16 | V&Ouml;: 29.05.2009</strong></p>
<p>Es ist soweit. Nachdem ich tagelang BUGs beseitigt habe und noch einige Neue Funktionen hinzugef&uuml;gt hab, pr&auml;sentiere ich Euch an diesem sonnigen Freitag den build #16 final. Auf der Hauptseite im internen Bereich wurde ein Feld f&uuml;r &quot;Andere Benutzer&quot; hinzugef&uuml;gt, welches einige von euch m&ouml;glicherweise aus den schuelerVZ kennen. Nebenbei hab ich wie gesagt einige BUGs beseitigt und die Suche optimiert. Auch der Best&auml;tigungscode f&uuml;r die Anmeldung ist nun nicht mehr n&ouml;tig.</p>
<p>PS: Auch wenn es so aussieht, ein Avatarservice wurde noch nicht eingebaut. Daher sind Bilderuploads noch nicht m&ouml;glich. Kommt aber auch noch! &nbsp;</p>
<p>&nbsp;</p>
<p>&nbsp;</p>
<p><strong>v0.0.5 #16 RC2 | V&Ouml;: 22.05.2009</strong></p>
<p>Nun, eigentlich sollte ich heute auf dem Geburtstag meiner Mutter helfen aber gut, ich hab auf build #16 RC2 geupdated. Die Suche sowie einige kosmetische &Auml;nderungen am Profilsystem sind Haupt&auml;nderungen.</p>
<p>&nbsp;</p>
<h4>v0.0.5 #16 RC1 | V&Ouml;: 25.03.2009</h4>
<p>Mit diesem Build pr&auml;sentiere ich die erste (relativ) lauff&auml;hige Version. Registrierungen sind ab sofort m&ouml;glich(aus Testinggr&uuml;nden nur f&uuml;r 
             Betatester). Die Benutzerverwaltung wurde eingerichtet und das Backend angepasst.<br />
&Auml;nderungen:</p>
<div id="listbox">
<ul class="ver">
    <li>WYSIWYG Editor</li>
    <li>Benutzerverwaltung</li>
    <li>S&auml;mtliche bisher eingebrachten Sachen laufen jetzt &uuml;ber SQL</li>
</ul>
</div>
<p><br />
<br />
<strong>&nbsp;v0.0.1 #15c (Code Clean) | V&Ouml;: 15.12.2008</strong></p>
<p>Ein weiterer build mit der Nummer 15. Hierbei handelt es sich um eine Neustrukturierung des Gesamtcodes. Hierdurch wird f&uuml;r mich die Wartung
             des Codes deutlich einfacher und das Gesamtbild wird &Uuml;berschaubarer. Optische Ver&auml;nderungen an dem was ihr seht gibt es kaum. Vielleich wurde
             hier und dort ein Button hinzugef&uuml;gt. Jedoch keine grundlegende Ver&auml;nderungen.
<br />
<br />
&nbsp;</p>
<h4>v0.0.1 #15b (Backend Build) | V&Ouml;: 05.12.2008</h4>
<p>Mit diesem build ist das Backend ins Spiel gekommen. Im Backend haben die Administratoren vorerst eine Handvoll grundlegenden Funktionen.
             Der Rest wird mit der Zeit einprogrammiert. Hier erstmal nur zum anschauen der build 15b.<br />
Grundlegende &Auml;nderungen</p>
<div id="listbox">
<ul class="ver">
    <li>Bugfix in der Registrierung (Benutzernamen k&ouml;nnen nun nichtmehr doppelt vergeben werden, eMail k&ouml;nnen nur 1 mal verwendet werden)</li>
    <li>Backend Erweiterung</li>
    <li>Anpassung des Frontends</li>
</ul>
</div>
<p><br />
&nbsp;</p>
<h4>v0.0.1 #15a (Alpha Advanced)| V&Ouml;: 23.11.2008</h4>
<p>Nachdem heute nachmittag #15 online gegangen ist, hab ich einen Fehler im Login-system gefunden. Diesen hab ich dann in stundenlanger
             Kleinstarbeit gesucht und auch gefunden und behoben. Dehalb hier nun der build 15a. Einzigste &Auml;nderung ist der Bugfix am Login-system.
<br />
<br />
&nbsp;</p>
<h4>v0.0.1 #15 | V&Ouml;: 23.11.2008</h4>
<p>Wie unschwer zu erkennen ist, hat der 15 build ein komplett neues Aussehen bekommen. Durch diese nette &Auml;nderung ist das verwalten
             verschiedener Stylesheets um einiges einfacher (sobald diese ersteinmal gecodet wurden). Nebenbei bemerkt wurde das MY ownCMS in
             MyCOM umbenannt, was urspr&uuml;nglich erst f&uuml;r v0.7 geplant war. Durch die &auml;nderung des Styleengines hab ichs aber nun vorgezogen.  
             Wesentliche &Auml;nderungen am 15 build sind:</p>
<div id="listbox">
<ul class="ver">
    <li>Neuer Styleengine</li>
    <li>Umgescriptetes Loginsystem</li>
    <li>Bugfix bei der Registrierung</li>
    <li>Umbenennung in MyCOM</li>
</ul>
</div>           
        </div>           
        <div id="footerl">        
        </div>           
        <div id="footerc"><h2>All rights reserved by MyCOM © 2009 | MyCOM is a division of Ion-Light</h2>        
        </div>      
      </div>           
    </div>         
    </div>               
    </div>                                                                                        
  </body>
</html>
 

Anhänge

Zuletzt bearbeitet:
Hatten wir das Thema nicht schon mal?
index_test.php hat gesagt.:
Warning: mysql_connect() [function.mysql-connect]: Access denied for user 'root'@'localhost' (using password: NO) in D:\xampp\htdocs\test\mycom\system\configuration.php on line 8
Keine Verbindung zu der Datenbank möglich.

//edit: Alles klar :)

mfg Maik
 
Ursache ist der deklarierte rechte Außenabstand für #usernavi.

Lösung:
CSS:
#usernavi{
margin: 0 0 0 81px; /* Außenabstand oben - rechts - unten - links */
float: left;
}


mfg Maik
 
Zurück