mediengestalter.info
FAQ :: Mitgliederliste :: MGi Team

Willkommen auf dem Portal für Mediengestalter

Aktuelles Datum und Uhrzeit: Fr 26.04.2024 00:05 Benutzername: Passwort: Auto-Login

Thema: CSS-float 2 buttons untereinander stellen! vom 22.02.2006


Neues Thema eröffnen   Neue Antwort erstellen MGi Foren-Übersicht -> Allgemeines - Nonprint -> CSS-float 2 buttons untereinander stellen!
Autor Nachricht
mtk
Threadersteller

Dabei seit: 29.11.2004
Ort: weit,weit weg
Alter: 37
Geschlecht: Männlich
Verfasst Mi 22.02.2006 10:56
Titel

CSS-float 2 buttons untereinander stellen!

Antworten mit Zitat Zum Seitenanfang

Grins Moin, hier das Problem!

html
Code:
<!--Zwei Auswahlboxen, die eine beinhaltet sämtliche Listungen zu dem Thema, die zweite beinhaltet eine Auswahl-->   
      <fieldset id="selectboxen" class="fieldset"><legend>Ansprechpartner/Mitarbeiter</legend>
         
            <div class="selectbox">
            <h2>Index</h2>
                <select class="selectbox_box" name="beschreibung" size="20" >
                  <option>option 1</option>
                  <option>option 2</option>
                  <option>option 3</option>
               </select>
            </div>      
            
            <div class="selectbox_buttoncontainer1">            
               <input type="submit" name="hinzufügen" value="<<" />
               
            <br class="stopper" />

               
               <input type="submit" name="entfernen" value=">>" />
            </div>
            
            <div class="selectbox">
            <h2>Auswahl</h2>
               <select class="selectbox_box" name="beschreibung" size="12">
                  <option>option 2</option>
               </select>
            </div>
            
            <br />
            

            <div class="selectbox_buttoncontainer2">
               <input type="submit" name="ma/ap bearbeiten" value="MA/AP bearbeiten" />
               <input type="submit" name="ma hinzufuegen" value="MA hinzufügen" />
               <input type="submit" name="ap hinzufuegen" value="AP hinzufügen" />
            </div>
      </fieldset>


css
Code:
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
      Selectbox alá AP/MA
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
div#inhalt fieldset {width:48em;}

/* div´s */
div#inhalt .selectbox {text-align:left; float:left; margin:0; padding:0; position:relative; left:5em;}

/* Die Auswahlboxen */
fieldset#selectboxen select.selectbox_box {width:20em; text-align:left; padding:0 1em 0em 1em;}

fieldset#selectboxen div.selectbox_buttoncontainer1 { position:relative;left:5em; background-color:#0066FF;}

fieldset#selectboxen div.selectbox_buttoncontainer2 {position:relative; left:13em;}

fieldset#selectboxen div.selectbox_buttoncontainer1 input {width:auto; margin:10.5em 0.5em 0 5.5em;}

fieldset#selectboxen div.selectbox_buttoncontainer2 input {width:auto; margin:2.4em 0 2em 0;}

div#inhalt br.stopper {clear:none;}



Momentan sieht der mist noch so aus:



Wer hat ne Idee? Die Buttons sollen eigentlich nur untereinander stehen!

Thx im Vorraus! mtk


Zuletzt bearbeitet von mtk am Mi 22.02.2006 11:11, insgesamt 2-mal bearbeitet
  View user's profile Private Nachricht senden
sturmoffice

Dabei seit: 09.05.2003
Ort: Bei Göttingen
Alter: 41
Geschlecht: Männlich
Verfasst Mi 22.02.2006 11:29
Titel

Antworten mit Zitat Zum Seitenanfang

Code:
div#inhalt br.stopper {clear:none;}

ersetzen zu
Code:
div#inhalt br.stopper {clear:both;}
  View user's profile Private Nachricht senden
Anzeige
Anzeige
mtk
Threadersteller

Dabei seit: 29.11.2004
Ort: weit,weit weg
Alter: 37
Geschlecht: Männlich
Verfasst Mi 22.02.2006 11:41
Titel

Antworten mit Zitat Zum Seitenanfang

Menno! nene,

hatt ich schon probiert! Is ja auch logisch. Ich hattes nur auf none gestellt um mir noch mal die Ausgangssituation anzusehen.

Sag ma, siehst du den screenshot den ich in meine Problemstellung reingestellt habe? bei mir ist er wieder verschwunden und tauch nicht mehr auf°°? * Such, Fiffi, such! *
  View user's profile Private Nachricht senden
beeviZ

Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mi 22.02.2006 14:50
Titel

Antworten mit Zitat Zum Seitenanfang

liegt der stopper<br> vielleicht einfach nich im div#inhalt?
das muss klappen, würd keinen sinn machen sonst.
  View user's profile Private Nachricht senden
mtk
Threadersteller

Dabei seit: 29.11.2004
Ort: weit,weit weg
Alter: 37
Geschlecht: Männlich
Verfasst Mi 22.02.2006 15:03
Titel

Antworten mit Zitat Zum Seitenanfang

* Ich geb auf... * er liegt im inhalt!

eigentlich müsste es funktionieren...tuts aber nicht!

tja...

@bevviz: ist der screenshot im ersten beitrag zu sehen?
  View user's profile Private Nachricht senden
beeviZ

Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht: Männlich
Verfasst Mi 22.02.2006 16:12
Titel

Antworten mit Zitat Zum Seitenanfang

dann musste den html code auch vollständig posten.

siehst du da etwa einen screenshot?
  View user's profile Private Nachricht senden
mtk
Threadersteller

Dabei seit: 29.11.2004
Ort: weit,weit weg
Alter: 37
Geschlecht: Männlich
Verfasst Mi 22.02.2006 16:19
Titel

Antworten mit Zitat Zum Seitenanfang

* grmbl * jaein

ich hatte den screenshot auf einen webspace hochgeladen und die url angegeben. er war etwa ne viertelstunde da...dann einfach weg.

aber ich hab noch nen link: http://rapidshare.de/files/13849859/float_prob.jpg.html

hier ist der komplette html_code:

Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>proVer-Projektverwaltung</title>
<link href="css/layout_screen.css" rel="stylesheet" type="text/css" />
</head>

<body>

<!--
*************************************
            Design
*************************************-->

<!-- Beginn hauptnavi - links-->
<div id="hauptnavi">
<form name="hauptnavigation" enctype="multipart/form-data" method="post" action="">
  <ul>
    <li>
      <select size="1">
      <option >Projekt mit sehr sehr sehr langem Namen</option>
      <option>bangem Namen</option>
     </select>
   <input type="submit" name="anzeigen" value="anzeigen" />
   </li>
   <!-- JOSCH: class statt id -->
    <li><a class="selected" href="#">neues Projekt anlegen</a></li>   
    <li><a href="#">Mitarbeiter</a></li>
    <li><a href="#">Suche</a></li>
    <li><a href="#">Wochenplan</a></li>
    <li><a href="#">Logout</a></li>
  </ul>
</form>
</div>
<!-- Ende hauptnavi - links -->

<!-- Beginn Projektnavi -->
<ul id="projektnavi">
   <li><a id="schnipsel_projektdaten_aktiv" href="#"></a></li>
    <li><a id="schnipsel_dokumente" href="#"></a></li>
   <li><a id="schnipsel_notizen" href="#"></a></li>
    <li><a id="schnipsel_ansprechpartner" href="#"></a></li>
    <li><a id="schnipsel_mitarbeiter" href="#"></a></li>
   <li><a id="schnipsel_termine" href="#"></a></li>
   <li><a id="schnipsel_finanzen" href="#"></a></li>
</ul>
<!-- Ende Projektnavi-->

<!-- Beginn TerminKurzinfo zum Projekt-->
<div id="termin_zettel">
  <p>Termine </p>
  <ul>
    <li>12.04.2005 <br /> Abgabe Designentw&uuml;rfe</li>
    <li>22.04.2005 <br /> Fertigstellung der Kalkulation</li>
  </ul>
</div>
<!-- Ende TerminKurzinfo zum Projekt-->   
<!--
*************************************
         Ende Design
*************************************-->


<!--
*************************************
         Formular
*************************************-->

<!-- Beginn Inhalts_Container= div "unterlage"-->
<div id="unterlage">
<div id="klemme"></div>

<!-- Beginn Inhaltsbereich-->
<div id="inhalt">
<form name="beschreibung" id="irgendein_name" enctype="multipart/form-data" method="post" action="" >
<!-- Beginn Formular Projektdaten -->


<!-- JOSCH: umschliessende p weg dafür br hin -->

      <br />
      <br />
      
      <!--Ein Texteingabe-Feld-->
      <label for="irgendein_name">Beschreibung:</label>
      <input type="text" id="irgendein_name" name="beschreibung" value="" />
      
      <br />
      <br />
      
      <!--Ein Text-Feld mit mehren Zeilen-->
      <label for="irgendein_name">Textblock:</label>
      <textarea id="irgendein_name" name="beschreibung">na!</textarea>
      
      <br />
      <br />
      
      <!--Ein Auswahlfeld mit meheren Optionen-->
      <label for="irgendein_name">Menue: </label>
          <select id="irgendein_name" name="beschreibung" size="1">
             <option value="">option 1</option>
            <option value="">option 2</option>
          </select>
      
      <br />
      <br />
      
      <!--Ein Datei-Suchen-Feld-->
      <label for="irgendein_name">Wo ist die Datei:</label>
      <input id="irgendein_name" class="file" name="beschreibung" type="file" value="" size="60"/>
      
      <br />
      <br />
      
      <!--Ein Attributsfeld-->
      <label for="irgendein_name">WICHTIG:</label>
      <input id="irgendein_name" class="checkbox" name="beschreibung" type="checkbox" value="" />
      <br />
      <br />

      <!--Ein Attributsfeld-->
      <label for="irgendein_name"></label>
      <input id="irgendein_name" class="checkbox" name="beschreibung" type="checkbox" value="" />WICHTIG
      
      <br />
      <br />
      
      <!--Ein Auswahl-Feld-->
      <label for="irgendein_name"></label>
      <input id="irgendein_name" class="radio" name="beschreibung" type="radio" value="" />Meeting
      
      <br />
      <br />
      
      <!--Ein Passwort-Eingabe-Feld-->
      <label for="irgendein_name">Passwort:</label>
      <input id="irgendein_name" name="beschreibung" type="password" value="" size="15" />
      
      <br />
      <br />      
      
      <!--Ein Übertragen-Schalter-->
      <input class="submit" id="irgendein_name" name="beschreibung" type="submit" value="Werde ich gedrückt, schicke ich die Daten los" />
      <input class="submit" id="irgendein_name" name="beschreibung" type="submit" value="Ich mach dasselbe ^^" />
      <input class="submit" id="irgendein_name" name="beschreibung" type="submit" value="Ich auch °°" />
<br />
<br />
<br />
<br />


<!-- JOSCH: fieldset statt h6+p -->

      <!--Ein Eingabefeld für einen bestimmten Zeitraum, wie Dauer eines Vertrages-->
      <div class="datum">
         <label for="irgendein_name">von:</label>
         <input type="text" class="datum" id="irgendein_name" name="von_tag" value="TT" size="2" maxlength="2" />
         <input type="text" class="datum" id="irgendein_name" name="von_monat" value="MM" size="2" maxlength="2" />
         <input type="text" class="datum" id="irgendein_name" name="von_jahr" value="JJJJ" size="4" maxlength="4" />
         <br />
         <br />
         <label for="irgendein_name">bis:</label>
         <input type="text" class="datum" id="projekt_bis" name="bis_tag" value="TT" size="2" maxlength="2" />
         <input type="text" class="datum" id="projekt_von" name="bis_monat" value="MM" size="2" maxlength="2" />
         <input type="text" class="datum" id="projekt_von" name="bis_jahr" value="JJJJ" size="4" maxlength="4" />
      </div>

<br />
<br />
<br />
<br />


      <!--Zwei Auswahlboxen, die eine beinhaltet sämtliche Listungen zu dem Thema, die zweite beinhaltet eine Auswahl-->   
      <fieldset id="selectboxen"><legend>Ansprechpartner/Mitarbeiter</legend>
         
         <div class="selectbox">
            <h2>Index</h2>
                <select class="selectbox_box1" name="beschreibung" size="20" >
                  <option>option 1</option>
                  <option>option 2</option>
                  <option>option 3</option>
               </select>
         </div>      
            
            <div class="selectbox_buttoncontainer1">
                        
               <input type="submit" name="hinzufügen" value="<<" />
               <br />

               <input type="submit" name="entfernen" value=">>" />
            </div>
            
            <div class="selectbox">
            <h2>Auswahl</h2>
               <select class="selectbox_box2" name="beschreibung" size="12">
                  <option>option 2</option>
               </select>
         </div>
            
            <br />

            

            <div class="selectbox_buttoncontainer2">
               <input type="submit" name="ma/ap bearbeiten" value="MA/AP bearbeiten" />
               <input type="submit" name="ma hinzufuegen" value="MA hinzufügen" />
               <input type="submit" name="ap hinzufuegen" value="AP hinzufügen" />
            </div>
         </fieldset>


<br />
<br />
<br />
<br />

         <a name="beschreibung" title="Beschreibung was passiert" href="#">neues Dokument erstellen</a>

         <!--Eine Aufzählung aller vorhandener Einträge zu dem Thema mit Bearbeitungslinks-->
         <div class="daten_liste">
     
               <br />
            
               Dateiname (Dateityp)
               <a href="#" class="funktion_bearbeiten" name="beschreibung_bearbeiten" title="bearbeiten">bearbeiten</a>
               <a href="#" class="funktion_loeschen" name="beschreibung_loeschen" title="löschen">löschen</a>
               <a href="#" class="funktion_download" name="beschreibung_download" title="download">download</a>
               
               <br />

               <p class="daten_text">Ein Dokument (von lat.: documentum = beweisende Urkunde; aus docere = lehren) ist
                  <br />* eine Urkunde,
                  <br />* in der EDV eine Datei, die nicht ausführbar ist, siehe auch Dokumentenmanagement,
                  <br />* eine Dokumentarische Bezugseinheit
                  <br />* in der Datenanalyse ein Begriff für Daten, die schriftlich niedergelegt sind, siehe Dokumentenanalyse
               </p>
         </div>   


<br />
<br />
<br />
         
            <!--Finish-Button die vorgenommene Änderrungen übernehmen oder verwerfen-->
            <div class="buttoncontainer_allg">
                 <input  name="beschreibung" title="beschreibung" type="submit"  value="hinzufügen" />
               <input  name="beschreibung" title="beschreibung" type="submit"  value="abbrechen"   /> 
             </div>


<br />
<br />
<br />
<br />

</form>
</div>
</div>
<!--
*************************************
         Ende Formular
*************************************-->


</body>
</html>
  View user's profile Private Nachricht senden
seal

Dabei seit: 31.07.2005
Ort: Pfalz
Alter: 41
Geschlecht: Männlich
Verfasst Mi 22.02.2006 19:06
Titel

Antworten mit Zitat Zum Seitenanfang

Fehlt nur noch der komplette CSS-Code!

Ne lauffähige Onlineversion wünscht sich meine Webdeveloper-Toolbar!
  View user's profile Private Nachricht senden
 
Ähnliche Themen divs im ie6 sind untereinander trotz float:left -.-
Hilfe: div float / width:100% - CSS float Box Model
PDFs untereinander verlinken
CSS - Navigationen untereinander (z-index)
[php] Klassen untereinander verwenden
[CSS] Boxen untereinander floaten
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.