mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Sa 27.04.2024 05:54 Benutzername: Passwort: Auto-Login

Thema: Überlappung bei DIVs vom 19.07.2006


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> Überlappung bei DIVs
Seite: Zurück  1, 2, 3  Weiter
Autor Nachricht
Vivid
Threadersteller

Dabei seit: 19.07.2006
Ort: Frankfurt am Main
Alter: 39
Geschlecht: Weiblich
Verfasst Do 20.07.2006 12:49
Titel

Antworten mit Zitat Zum Seitenanfang

dann schick mir doch einmal mal paar codeschnippsel per ICQ!!
  View user's profile Private Nachricht senden
Vivid
Threadersteller

Dabei seit: 19.07.2006
Ort: Frankfurt am Main
Alter: 39
Geschlecht: Weiblich
Verfasst Fr 28.07.2006 10:42
Titel

Antworten mit Zitat Zum Seitenanfang

Wollte dieses Thread mal wieder eröffnen!

Kann mir jemand vielleicht einen Tipp geben, wie es funktionieren könnte??

Das umstrukturieren des Codes, werde ich später machen!

Steffi


Zuletzt bearbeitet von Vivid am Sa 29.12.2007 16:44, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
Anzeige
Anzeige
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Fr 28.07.2006 11:29
Titel

Antworten mit Zitat Zum Seitenanfang

Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Layout | Vivid</title>
<style type="text/css">
<!--
* {
   margin:0;
   padding:0;
}
body {
   text-align:center;
}
#top {
   margin:auto auto;
   width:700px;
   height:120px;
   background:#ddd;
}
ul#topnav {
   list-style:none;
   margin:auto auto;
   width:700px;
   height:30px;
   line-height:30px;
   text-align:left;
   background:#bbb;
}
ul#topnav li {
   display:inline;
}
#wrapper {
   margin:auto auto;
   padding-bottom:400px; /* nur um die höhe zu imitieren */
    width:700px;
   text-align:left;
   background:#999;
   overflow:hidden;
}
ul#subnav {
   list-style:none;
   float:left;
   width:120px;
   background:#eee;
}
#content {
   float:right;
   width:580px;
}
#footer {
   margin:auto auto;
   width:700px;
   background:#666;
}
-->
</style>
</head>

<body>
   
   <div id="top">Top</div>
   <ul id="topnav">
      <li>Navigation</li>
      <li>Navigation</li>
      <li>Navigation</li>
      <li>Navigation</li>
      <li>Navigation</li>
      <li>Navigation</li>
      <li>Navigation</li>
   </ul>
   <div id="wrapper">
      <ul id="subnav">
         <li>Navigation</li>
         <li>Navigation</li>
         <li>Navigation</li>
      </ul>
      <div id="content">
         Inhalt Inhalt Inhalt Inhalt Inhalt Inhalt Inhalt Inhalt
      </div>
   </div>
   <div id="footer">Footer</div>
</body>
</html>


Zuletzt bearbeitet von m am Sa 29.07.2006 12:35, insgesamt 3-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
marcusm

Dabei seit: 06.05.2002
Ort: europa
Alter: 46
Geschlecht: Männlich
Verfasst Fr 28.07.2006 11:30
Titel

Antworten mit Zitat Zum Seitenanfang

hi vivid,
damit du mal so langsam an die lösung deines problems mit den überlappenden divs kommst:

Code:
<html>
<head>
   <title>Unbenannt</title>
   <style type="text/css">
   #gesamt{
      margin: 0;
      padding: 0;
   }
   #navigation {
      background: #1CC10F;
      float: left;
   }
   #content {
      background: #D7874C;
      float: left;
   }
   .clear_left {
   clear: left;
   }
   </style>
</head>
<body>
<div id="gesamt">
   <div id="navigation">++Navi++</div>
   <div id="content">++Content++</div>
   <br class="clear_left" />
</div>
</body>
</html>


damit dürfte sich jeder der beiden inneren divs verlängern und das äußere div mitnehmen...

viel spaß
  View user's profile Private Nachricht senden
t0y

Dabei seit: 16.04.2006
Ort: Bremen
Alter: 36
Geschlecht: Männlich
Verfasst Fr 28.07.2006 12:13
Titel

Antworten mit Zitat Zum Seitenanfang

Die Navi kommt mir sehr bekannt vor. Woher haste die?
  View user's profile Private Nachricht senden
Vivid
Threadersteller

Dabei seit: 19.07.2006
Ort: Frankfurt am Main
Alter: 39
Geschlecht: Weiblich
Verfasst Fr 28.07.2006 15:06
Titel

Antworten mit Zitat Zum Seitenanfang

welche navi meinste denn genau???
  View user's profile Private Nachricht senden
skate-rock

Dabei seit: 29.08.2003
Ort: Osnabrück
Alter: -
Geschlecht: Männlich
Verfasst Fr 28.07.2006 16:42
Titel

Antworten mit Zitat Zum Seitenanfang

t0y hat geschrieben:
Die Navi kommt mir sehr bekannt vor. Woher haste die?


die gibts jawohl zu zehntausenden im netz, solche navigation.. Meine Güte!
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
don

Dabei seit: 03.07.2006
Ort: Fulda
Alter: -
Geschlecht: Männlich
Verfasst Sa 29.07.2006 10:58
Titel

Antworten mit Zitat Zum Seitenanfang

ich frage mich, wieso du auf divs umsteigen willst, aber es nicht machst. es bringt garnichts, deine äußere tabelle einfach durch ein div zu ersetzen, das ist nicht der sinn der sache. ich vermute mal du möchtest divs verwenden, weil sie dem aktuellen standard entsprechen. wenn du das machen möchtest, dann musst du auch dafür sorgen, dass der rest deines codes dem aktuellen standard entspricht und das ist definitiv nicht der fall.

für diese webseite brauchst du um genau zu sein 0 tabellen. und images mit js preloaden, das macht man auch nicht mehr. hover effekte mit js kannste auch total vergessen.

alles was du brauchst, sind ein paar css kenntnisse. wichtig hierbei ist, dass du den inhalt vom layout trennst. den inhalt fügst du mit html ein, die komplette positionierung (layout) machst du mit css. du hast einen hässlichen mischmasch. dein ziel sollte folgende struktur sein:

Code:

<!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">

   <head>
      <title>Baseballclub Friedberg Braves 1987 e.V.</title>
      <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
      <link rel="stylesheet" type="text/css" href="base.css" />
   </head>
   
   <body>
    
     <div id="body">
      
       <div id="header"></div>
      
       <div id="topmenu">
         <ul>
           <li><a id="home" href="index.php?div=teams&amp;amp;subnavi=home"></a></li>
           <li><a id="teams" href="index.php?div=teams&amp;subnavi=teams"></a></li>
           <li><a id="gameday" href="index.php?div=gameday&amp;subnavi=gameday"></a></li>
           <li><a id="media" href="index.php?div=junioren&amp;subnavi=media"></a></li>
           <li><a id="foum" href="index.php?div=junioren&amp;subnavi=home"></a></li>
           <li><a id="info" href="index.php?div=junioren&amp;subnavi=info"></a></li>
           <li><a id="impressum" href="index.php?div=impressum&amp;subnavi=home"></a></li>
         </ul>
       </div>
      
       <div id="sidemenu">
         <ul>
           <li><a href="index.php?div=teams&amp;subnavi=home">Home</a></li>
           <li><a href="index.php?div=teams&amp;subnavi=teams">Teams</a></li>
           <li><a href="index.php?div=gameday&amp;subnavi=gameday">Gameday</a></li>
           <li><a href="index.php?div=junioren&amp;subnavi=media">Media</a></li>
           <li><a href="index.php?div=junioren&amp;subnavi=home">Foum</a></li>
           <li><a href="index.php?div=junioren&amp;subnavi=info">Info</a></li>
           <li><a href="index.php?div=impressum&amp;subnavi=home">Impressum</a></li>
         </ul>
       </div>
      
       <div id="content">
         <h1>Migration der neuen Website erfolgreich geschafft</h1>
         <h2>Friedberg Braves baut nun auf CMS "Joomla!"</h2>
         <p><strong>Friedberg, den 12.04.2006</strong>
           Seit heute ist es nun offiziell.Die neue Website der Friedberg
           Braves ist jetzt endlich über www.friedberg-braves.de erreichbar.
           Optisch wurde zwar das alte Design bisher noch beibehalten, jedoch
           ist die Seite nun in ein Content-Mangement-System einbaut worden.
           Hierbei setzen die Braves auf das Open Source Skript namens Joomla!.
           Durch die Umstellung auf ein CMS, möchte der Verein sich die Möglichkeit
           offen halten, in Zukunft, Berichte ohne größere administrative Eingriffe
           zu veröffentlichen. Somit können Berichte einfacher, schneller und öfter
           veröffentlich werden. Mit Joomla! wird die Website in Zukunft sicherlich
           aktueller sein, als in Zeiten zuvor.
         </p>
         <h1>Braves-Herren mit Doppelsieg am ersten Spieltag</h1>
         <p><strong>Friedberg, den 08.04.2006</strong>
           Die erste Manschaft der Friedberg Braves gewinnt am ersten
           Spieltag der Saison zeimal gegen Frankfurt 1860. Das erste
           Spiel endete bereits nach dem sechsten Inning beim Spielstand
           von 22:11. Das zweite Spiel ging über die vollen sieben Innings
           und endete 17:15 zu Gunsten der Braves. Das nächste Spiel findet
           am 22. April auf der heimischen Seewiese gegen die Eagles aus Neu
           Anspach statt.
         </p>
         <h1>Interessierte Damen für Softball-Team gesucht</h1>
         <h2>Friedberg Braves gründen wieder ein Softball-Team</h2>
         <p><strong>Friedberg, den 14.02.2006</strong>
           Nachdem nun einige Jahre in Friedberg nicht mehr die Softballschläger
           geschwungen wurden, möchten die Braves nun in der kommenden Saison
           wieder ein Softball-Team melden. Hierzu werden noch zahlreich weibliche
           Interessierte ab 14 Jahren gesucht. Nach oben hin sind keine Grenzen
           gesetzt. Du treibst gerne Sport und hast eventuell schon mal ein
           Baseball-/Softballspiel gesehen? Du möchtest auch mal die "Keule"
           schwingen? Du bist interessiert daran, diesen Sport eventuell auch
           neu zu erlernen? Dann schreibe eine kurze Mail an:
           vorstand@friedberg-braves.de. Und vielleicht feiern wir schon bald
           die ersten Softballerfolge zusammen. Die Braves freuen sich auf Dich.
         </p>
         <h1>Juniorenteam der Friedberg Braves erneut Hessenmeister</h1>
         <h2>Deutlicher Finalsieg gegen Bad Homburg Hornets</h2>
         <p><strong>Friedberg, den 07.09.2005</strong>
           Das Baseball-Juniorenteam der Friedberg Braves hat am vergangenen
           Wochenende in Darmstadt die Hessenmeisterschaft gewonnen und damit
           den Titel des Vorjahres erfolgreich verteidigt. Nach einem 7-6
           Halbfinalsieg gegen die Dreieich Vultures bezwangen die Braves im
           Finale die Bad Homburg Hornets mit 11-5. ...
           <a href="index.php?div=Bericht&amp;id=1">weiter</a>
         </p>
       </div>
      
       <div id="footer">
         <p>Baseballclub Friedberg Braves 1987 e.V.</p>
       </div>
      
       <br style="clear:left;" />
      
     </div>
    
   </body>
   
</html>


den rest machst du mit css, dann hast du eine webseite, die dem heutigen anforderungen entspricht. du hast bei deiner website ja nicht mal einen doctype angegeben..

um zu überprüfen, ob das alles richtig ist, was du da machst, überprüfst du dein html regelmäßig mit dem validator der w3 (http://validator.w3.org/check).

mal ganz abgesehen vom code, finde ich das "doppelte menü" total überflüssig. ich würde mich für eine der beiden navigationen entscheiden.

ne' tolle seite für alles rund um css ist http://www.css4you.de/ - wenn du nicht klar kommst, melde dich - dann helf ich dir.


gruß don


/Edit
oh, hatte die zweite seite garnicht gesehen ;p Aber der andere codevorschlag enthält nicht das menü, was ja tabellentechnisch ein großes problem bei dir ist. die sache mit dem br-tag mit dem style clear:left; funktioniert. du sagtest allerdings, er funktioniert nicht.. dann wirst du ein anderes problem haben. versuch erstmal webseiten zu erstellen, die valide sind - sodass sie von jedem browser richtig interpretiert werden.


Zuletzt bearbeitet von don am Sa 29.07.2006 11:05, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden
 
Ähnliche Themen DIV Überlappung mit Transparentem Bild.
InDesign: Kontur von der Überlappung des Buchstaben entfernen
[Illustrator] - Überlappung verschiedener Pfade anpassen
Website mit divs und css
Seitenaufbau mit CSS und DIVs?
höhenangaben von divs
Neues Thema eröffnen   Neue Antwort erstellen Seite: Zurück  1, 2, 3  Weiter
MGi Foren-Übersicht -> Allgemeines - Nonprint


Du kannst keine Beiträge in dieses Forum schreiben.
Du kannst auf Beiträge in diesem Forum nicht antworten.
Du kannst an Umfragen in diesem Forum nicht mitmachen.