Verschachtelte floating divs Ursache äußere div nicht wachsen

Wenn jemand vorschlagen kann, eine bessere Platzierung als stackoverflow für css-Fragen bitte lassen Sie mich wissen.

Ich habe ein äußeres div mit hintergrund und Rahmen, und dann muss ich zwei Spalten haben, in das farbige Feld. Irgendeinem Grund, wenn ich die floating divs innerhalb des äußeren div, das äußere div wächst nicht mit.

Hier ist mein HTML:

<div class="tip_box">
    <h3>Send</h3>
    <hr />
    <form id="email_form">

        <div class="three-columns">
            <div class="contact_form_input">
                <h6>Your Name</h6>
                <input type="text" name="name_text_box" class="form_input" id="name_text_box" />
            </div>
            <div class="contact_form_input">
              <h6>Your Email</h6>
              <input type="text" name="email_text_box" class="form_input" id="email_text_box" />
            </div>
        </div>
        <div class="three-columns">
            <div class="contact_form_input">
                <h6>Recipient Name</h6>
                <input type="text" name="name_text_box" class="form_input" id="Text1" />
            </div>
            <div class="contact_form_input">
              <h6>Recipient Email</h6>
              <input type="text" name="email_text_box" class="form_input" id="Text2" />
            </div>
        </div>

    </form>
</div>

<p>This is where your message will go. Anything you want, as long as you want. Make it personal; make the recipient know you care.</p>

Hier ist mein CSS:

.three-columns {
    width: 290px;
    float: left;
    margin-right: 45px;
}
.tip_box {
    padding: 20px;
    margin: 20px 0px;
    -moz-border-radius: 7px;
    -webkit-border-radius: 7px;
    -khtml-border-radius: 10px;
    border-radius: 7px;
    padding-left: 55px;
    background: #eee;
    font-style:italic;
    background: #eff7d9 url(../images/icons/tip.png) no-repeat scroll 10px 15px;
    border: 1px solid #b7db58;
    color: #5d791b;
}

Screenshot:

http://dl.dropbox.com/u/2127038/cssissue.png

  • Ich Liebe, wie Sie ein Bild zu zeigen deutlich das problem, das Sie hatten. Wirklich schnell und einfach zu sehen, die problem die du beschreibst, ist genau die gleiche, die ich war auf der Suche zu lösen. +1
InformationsquelleAutor Jeremy H | 2010-11-12
Schreibe einen Kommentar