Autor |
Nachricht |
mtk
Threadersteller
Dabei seit: 29.11.2004
Ort: weit,weit weg
Alter: 37
Geschlecht:
|
Verfasst Mi 22.02.2006 10:56
Titel CSS-float 2 buttons untereinander stellen! |
|
|
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
|
|
|
|
|
sturmoffice
Dabei seit: 09.05.2003
Ort: Bei Göttingen
Alter: 41
Geschlecht:
|
Verfasst Mi 22.02.2006 11:29
Titel
|
|
|
Code: | div#inhalt br.stopper {clear:none;} |
ersetzen zu
Code: | div#inhalt br.stopper {clear:both;} |
|
|
|
|
|
Anzeige
|
|
|
mtk
Threadersteller
Dabei seit: 29.11.2004
Ort: weit,weit weg
Alter: 37
Geschlecht:
|
Verfasst Mi 22.02.2006 11:41
Titel
|
|
|
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°°?
|
|
|
|
|
beeviZ
Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mi 22.02.2006 14:50
Titel
|
|
|
liegt der stopper<br> vielleicht einfach nich im div#inhalt?
das muss klappen, würd keinen sinn machen sonst.
|
|
|
|
|
mtk
Threadersteller
Dabei seit: 29.11.2004
Ort: weit,weit weg
Alter: 37
Geschlecht:
|
Verfasst Mi 22.02.2006 15:03
Titel
|
|
|
er liegt im inhalt!
eigentlich müsste es funktionieren...tuts aber nicht!
tja...
@bevviz: ist der screenshot im ersten beitrag zu sehen?
|
|
|
|
|
beeviZ
Dabei seit: 30.09.2002
Ort: -
Alter: -
Geschlecht:
|
Verfasst Mi 22.02.2006 16:12
Titel
|
|
|
dann musste den html code auch vollständig posten.
siehst du da etwa einen screenshot?
|
|
|
|
|
mtk
Threadersteller
Dabei seit: 29.11.2004
Ort: weit,weit weg
Alter: 37
Geschlecht:
|
Verfasst Mi 22.02.2006 16:19
Titel
|
|
|
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ü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>
|
|
|
|
|
|
seal
Dabei seit: 31.07.2005
Ort: Pfalz
Alter: 41
Geschlecht:
|
Verfasst Mi 22.02.2006 19:06
Titel
|
|
|
Fehlt nur noch der komplette CSS-Code!
Ne lauffähige Onlineversion wünscht sich meine Webdeveloper-Toolbar!
|
|
|
|
|
|
|
|
Ä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
|
|