Anfängerkram: Wie kann man verhindern, dass sich die Divs von CSS überschneiden?

Question

Jul 08, 2013, 09:43 PM

Anfängerkram: Wie kann man verhindern, dass sich die Divs von CSS überschneiden?

Erste Frage überhaupt: Ich habe vor ungefähr einem Monat aufgrund eines Jobs angefangen, an CSS zu arbeiten, aber es scheint, dass ich auf einige Probleme gestoßen bin, die ich nicht beheben kann (hauptsächlich aufgrund meiner Unerfahrenheit und der Tatsache, dass es sich um das CSS einer anderen Person handelt).

Ich werde nicht so viel um den heißen Brei herumreden und das Problem erklären, bevor ich den Code zeige. Es gibt eine Reihe von Divs in einer formularähnlichen Umgebung, aber wenn der Text zu überfüllt ist, dringt er in die nächste Div ein und repariert ihn über CSS und nicht über HTML. Aufgrund des Problems kann ich mir vorstellen, dass es so einfach ist, dass es albern ist, aber na ja.

Bearbeiten: Ich habe irgendwie vergessen, diesen Teil zu erwähnen, ich möchte nicht, dass sie ausgeblendet werden, ich möchte, dass jedes Div automatisch zulässt, dass das "vorherige" seine Konzentration ohne Überlappung beendet (Versucht mit Überlauf: Auto, aber es gab ihnen Bildlaufleisten für alle Formulare auf der gesamten Site.

Hier ist ein Bild davon, wie es im Moment aussieht. Ich bin sicher, dass Sie das Problem sofort erkennen werden

http://imgur.com/aj8pDaO

Hier ist das relevante HTML

<html>
<head>
    <link href="hue.css" rel="stylesheet">
</head>
<body>
    <div class="content">

        <div class="column">
            <div class="form">
                <div class="form-nivel">
                    <label for="cfdiCreate:organizationRfc">RFC</label><label id="cfdiCreate:organizationRfc">XXXXXXXXXXXX</label>
                </div>
                <div class="form-nivel">
                    <label for="cfdiCreate:organizationTaxSystem">Regimen    fiscal</label><label id="cfdiCreate:organizationTaxSystem">Sueldos y salarios</label>
                </div>
                <div class="form-nivel">
                    <label for="cfdiCreate:organizationTaxAddress">Domicilio  fiscal</label><label id="cfdiCreate:organizationTaxAddress">XXXXXX Colonia Tecnológico  Monterrey,Nuevo León,México.C.P.XXXXXX</label>
                </div>
                <div class="form-nivel">
                    <label for="cfdiCreate:organizationExpeditionPlace">Lugar de  expedición</label><label id="cfdiCreate:organizationExpeditionPlace">Suc.1 Chiapas,México.     </label>
                </div>
            </div>
        </div>
        <div class="column secondary">
            <!--?xml version="1.0" encoding="UTF-8"?-->
        </div>
</body>
</html>

Und hier ist das CSS

body {
    font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
    text-align: center;
}

p {
    text-align: left;
}

.content {
    display: block;
    width: 100%;
    height: auto;
    margin-bottom: 10px;
    float: left;
    background: #;
    text-align: left;
}

    .content label, .content p {
        font-size: 16px;
        color: #024DA1;
        padding-left: 2%;
    }

.column {
    display: block;
    float: left;
    width: 48%;
    margin-top: 15px;
    height: auto;
    background:;
}

.secondary {
    margin-left: 10px;
}

.clearfix {
    clear: both;
    margin-bottom: 10px;
}

.form {
    display: block;
    width: 96%;
    height: auto;
    background:;
}

.form-nivel {
    display: block;
    width: 100%;
    width: 470px;
    min-height: 20px;
    margin-bottom: 20px;
    position: relative;
}

    .form-nivel label {
        width: 160px;
        float: left;
        height: 20px;
        line-height: 20px;
        margin-right: 10px;
        text-align: right;
    }