mediengestalter.info
Datenschutzerklärung
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter
Aktuelles Datum und Uhrzeit: Do 25.04.2024 23:43 Benutzername: Passwort: Auto-Login

Thema: 5 divboxen mit float left nebeneinander? vom 12.04.2007


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> 5 divboxen mit float left nebeneinander?
Autor Nachricht
Sunlifestyle
Threadersteller

Dabei seit: 20.12.2005
Ort: Hoyerswerda bei Dresden
Alter: -
Geschlecht: Männlich
Verfasst Do 12.04.2007 21:58
Titel

5 divboxen mit float left nebeneinander?

 Antworten mit Zitat Zum Seitenanfang
hallo..ich würde sehr gerne 5 div boxen nebeneinander positionieren...allerdings müssen alle divboxen in einer divbox ummantelt sein die die eig. float left hat!
wie könnt ich das machen?
momentan schaut es so aus:
css:
Code:
body{
color: #333;
font-size: 11px;
font-family: verdana;
background-color:#fff;
}
.tab h3{
color: #333;
padding: 3px;
font-size: 12px;
margin: 0 1px 1px 0;
text-align: center;
background: #6FB9E9;
}
h3{
margin: 0;
padding: 5px;
font-size: 14px;
}
p{
margin: 0;
padding: 5px;
line-height: 1.5em;
}
#wrapper{
width: 600px;
}
#left{
float: left;
width: 100px;
}
#right{
float: right;
width: 500px;
}
.tab{
color: #333;
padding: 3px;
margin: 0 1px 1px 0;
text-align: left;
}
.stretcher{
background: #fff;
}


html:
Code:
<div id="left">
      <div class="tab">
            <a href="javascript:;" " onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Start','','bilder/01over.jpg',1)"><img src="bilder/01.jpg" name="Start" border="0" id="Start" /></a>
         </div>
         <div class="tab">
            <a href="javascript:;" " onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Firma','','bilder/02over.jpg',1)"><img src="bilder/02.jpg" name="Firma" border="0" id="Firma" /></a>
         </div>
         <div class="tab">
            <a href="javascript:;" " onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Leistungen','','bilder/03over.jpg',1)"><img src="bilder/03.jpg" name="Leistungen" border="0" id="Leistungen" /></a>
         </div>
         <div class="tab">
            <a href="javascript:;" " onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Referenzen','','bilder/04over.jpg',1)"><img src="bilder/04.jpg" name="Referenzen" border="0" id="Referenzen" /></a>
         </div>
         <div class="tab">
            <a href="javascript:;" " onmouseout="MM_swapImgRestore()" onmouseover="MM_swapImage('Kontakt','','bilder/05over.jpg',1)"><img src="bilder/05.jpg" name="Kontakt" border="0" id="Kontakt" /></a>
         </div>
         <br />
      </div>


weiß da wer ne lösung?

danke:)
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
m
Moderator

Dabei seit: 18.11.2004
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Do 12.04.2007 22:16
Titel

Antworten mit Zitat Zum Seitenanfang
Ich verstehe nicht wo das Problem liegt?- ist doch ganz simpel.
Du floatest einfach die inneren Elemente, ist doch egal ob das
äußere auch mit einer Float Eigenschaft versehen ist.


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" lang="de">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>toggle</title>
<style type="text/css">
div#test {
   background:#eee;
   overflow:hidden;
   width:500px;
}
div#test div {
   float:left;
   width:100px;
}
</style>
</head>
<body>
   <div id="test">
      <div>Test</div>
      <div>Test</div>
      <div>Test</div>
      <div>Test</div>
      <div>Test</div>
   </div>
</body>
</html>


Zuletzt bearbeitet von m am Do 12.04.2007 22:22, insgesamt 1-mal bearbeitet
  View user's profile Private Nachricht senden Website dieses Benutzers besuchen
Anzeige
Anzeige
 
Ähnliche Themen Div Float Left Problem
Listenaufzählungszeichen verschwinden bei float:left
Frage zu float & clear:left
float:left höhe anpassen
Probleme CSS IE overflow und float:left
[Float: Left] Fetter Fehler
Neues Thema eröffnen   Neue Antwort erstellen
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.

Mediengestalter.info ist ein Projekt von Webformatik :: Forensoftware: phpBB