Wie kann ich entfernen, border-bottom des letzten div' separator durch CSS?

Zeige ich aktuelle news in einem div-box, in der jede Nachricht ist von den anderen getrennt durch einen separator von border-bottom. Beachten Sie, dass in der HTML-ich bin nicht mit jedem ul-li; anstatt ich bin einfach mit divs. Das problem ist, dass die letzten Nachrichten, die div ist auch zeigt der border-bottom separator. Ich weiß nicht, wie es zu entfernen, auch habe ich bereits versucht :last-child Selektor, aber es funktioniert nicht. Ich weiß, durch die Verwendung von ul-li, das problem kann gelöst werden durch :last-child, aber ich will nicht ändern mein HTML. Hier ist ein snaphost:

Wie kann ich entfernen, border-bottom des letzten div' separator durch CSS?

HTML-CODE:

<div class="float_left_div posts">
    <h3>Latest News</h3>
    <div class="news_wrapper">
        <div class="news_txt">
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy. <span>more+</span></p>
        </div>
        <div class="div_separator"></div>
    </div>
    <div class="news_wrapper">
        <div class="news_txt">
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy. <span>more+</span></p>
        </div>
        <div class="div_separator"></div>
    </div>
    <div class="news_wrapper">
        <div class="news_txt">
            <p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam nonummy. <span>more+</span></p>
        </div>
        <div class="div_separator"></div>
    </div>
</div>

Die demo ist unter:

JSFiddle

So halten Sie die gleiche HTML -, wie können wir entfernen die Letzte Grenze der separtor?

  • Sie verwendet .posts .news_wrapper { padding:-1px 15px; } was nicht korrekt ist. Wir verwenden kann -ve Polsterung wie -ve-Marge.
  • Das ist, warum ich sagte, es war ein hack mate. Nicht tun sollen, aber Sie funktioniert. Wie auch immer, Sie haben gesagt, Sie sind ok mit last-child also ich denke, dass löst es 🙂
InformationsquelleAutor user3779493 | 2014-07-18
  1. 5

    CSS last-child Eigenschaft den Rahmen zu entfernen.

    .posts .news_wrapper:last-child .div_separator
{
border-bottom:0px;
}

    DEMO

    • Diese Antwort funktioniert und benötigt nur für die CSS geändert werden.
    • ich wusste gar nicht ändern HTML
    • ich habe nie gesagt, ich will nicht zu verwenden :last-child; eher als ich sagte, dass ich nicht wollen, verwenden Sie ul-li. Ich will die Lösung durch die Beibehaltung der gleichen HTML-Code. Können Sie bitte Lesen Sie meine Frage?
    InformationsquelleAutor Suresh Ponnukalai
  2. 0

    Bitte beachtet, dass das das :last-child die pseudo-Klasse nicht in den meisten Browsern funktionieren. Wenn ich wo würde ich die Grenze nach oben (statt unten) und verwenden Sie dann 

    .posts .news_wrapper:first-child .div_separator{border-top:0px;}

    Bitte beachten Sie zunächst:Kind anerkannt wird in den meisten Browsern.

    • was meinst du mit "die meisten Browser?"
    • Vor allem IE. last-Kind unterstützt IE9 + und das erste Kind wird unterstützt, im IE7 +.
    • Wenn es nicht funktioniert, muss es widersprüchliche Stile irgendwo, wenn könnten Sie schicken einen link auf die Seite oder verwenden Sie js fiddle, dann bin ich glücklich, es zu betrachten. Wenn Sie verwendet haben last-child Ihr wahrscheinlich Probleme haben, alles unter IE9
    InformationsquelleAutor Jay
Schreibe einen Kommentar