XHTMLforum

XHTMLforum (http://xhtmlforum.de/index.php)
-   CSS (http://xhtmlforum.de/forumdisplay.php?f=73)
-   -   CSS / HTML Problem (http://xhtmlforum.de/showthread.php?t=69463)

Meister 29.05.2013 00:07

CSS / HTML Problem
 
Hallo Leute,
ich bin neu hier, wollte mich von Foren fern halten, aber um mein CSS/HTML zu verbessern brauch ich nun die Hilfe und hoffe hier noch viel zu lernen :)


Folgendes Problem habe ich:
Ich habe eine HTML Seite mit einem Gesamt-Div.
Dieser Div enthält mehrere Divs, wovon diese Divs wieder jeweils einen Div enthalten.



Ich nenn es Mal "Gesamt-Div", darin befindet sich ein "Auswahl-Div" und darin befindet sich der "Inhalt-Div". Damit man mir besser folgen kann :)

Im "Auswahl-Div" ist an sich kein Inhalt, außer der Inhalt, der im "Inhalt-Div" steckt. Der "Auswahl-Div" enthält via CSS nur die Position, wo der Div innerhalb des "Gesamt-Divs" sein soll.

In dem "Inhalt-Div" befindet sich eine Auswahlbox, welche ich ebenfalls positioniert habe. Diese soll genau zentral in dem "Gesamt-Div" sein. Nun kommt das Problem! Ich habe das so gemacht, dass sich je nach Auswahl, die ich in dem Auswahlfeld treffe, darüber eine Grafik anzeigt.
Aber dadurch verschiebt sich nun das Auswahlfeld nach unten.

Ich habe es zuvor mit margin-top: -XXpc positioniert. Das bedeutet ja, dass nach oben ein gewisser Abstand ist, doch sobald sich über den Auwahlfeldern ein neues Element öffnet (in diesem Fall die Grafik) so betrifft der Befehl margin-top ja nicht mehr das Auswahlfeld, sondern die Grafik, die Folge ist also, dass alles verutscht.


Ich habe es nun versucht, in dem ich mit margin-bottom arbeite, so dass das Auswahlfeld sich nicht verschiebt, sondern nur darüber die Grafik angezeigt wird, aber irgendwie wird bei mir margin-botom nicht beachtet, es tut sich nämlich nichts :(


Nun noch zu meinen Codes:

CSS:
HTML-Code:

.freistossgesamt {
  clear: both;
  float: left;
  height: 150px;
  width: 250px;
  margin-top: -235px;
  margin-left: 560px;
  color: #fff;
  background-image: url(/ws/grafiken/freistoss/direkt.png);
  background-repeat: no-repeat;
  border: 1px solid #000;
}

.freistossinhalt {
  clear: both;
  float: left;
  bottom: 300px;
  color: #fff;
}


HTML:

HTML-Code:

<div class="taktikall">
  <div class="freistossgesamt">
                <div class="freistossinhalt"><!-- START fr_bild --> {bild} <!-- END fr_bild --><b>Freistöße:</b><br>
                    <select name="freistoss" style="width: 100px">
                        <option value="0"></option>
                        <!-- START spieler_frei -->
                        <option value="{id}" <!-- START frei_selected --> selected <!-- END frei_selected -->>{name}</option>
                        <!-- END spieler_frei -->
                    </select><br>
                    <font>
                    <select name="freiart" style="width: 100px">
                        <option value="direkt">Auf´s Tor</option>
                        <option value="vor">Vor´s Tor</option>
                        <option value="gemischt">Normal</option>
                    </select>
                    </font>
                </div>
            </div>
</div>


explanator 29.05.2013 16:09

Ein Link zur Seite wäre besser.


Alle Zeitangaben in WEZ +2. Es ist jetzt 17:36 Uhr.

Powered by vBulletin® Version 3.8.11 (Deutsch)
Copyright ©2000 - 2024, vBulletin Solutions, Inc.

© Dirk H. 2003 - 2023