Text im div in selber größe

    Und zwar sieht es gerade wie folgt aus:

    Wie man sehen kann, sind die buttons jetzt immer auf verschiedener Höhe, da die Textlänge bei jedem div unterschiedlich ist.

    Wie könnte ich das jetzt lösen ? Das egal wie lang der text ist, die buttons immer auf gleicher Höhe bleiben.

    • Gerade eben
    • Anzeige

    Hallo!

    Wenn du gerade an deiner Website arbeitest oder dein aktuelles Hosting überdenkst: Wir betreiben mit NetzLiving eine Hosting-Plattform, die speziell auf Performance, Sicherheit und einfache Verwaltung ausgelegt ist.

    • ✔️ Schnelle Ladezeiten (optimiert für WordPress & Co.)
    • ✔️ Deutsche Server & DSGVO-konform
    • ✔️ Persönlicher Support (kein 0815-Ticket-System)

    Mehr erfahren

    Zitat von Presskopp

    Du könntest den buttons per CSS einen festen Abstand zum nächsten Element geben. Genauer sagen kann man das erst nach Kenntnis des Codes..


    Code sieht wie folgt aus:

    HTML
    <div class="vc_col-sm-4 wpb_column vc_column_container ">        
<div class="wpb_wrapper">                
<div class="wpb_single_image wpb_content_element vc_align_center">        
<div class="wpb_wrapper">                        
<a href="http://www.link.com" target="_self">
<div class="vc_single_image-wrapper   vc_box_border_grey"><img width="300" height="300" src="http://www.foto.jpg" class="vc_single_image-img attachment-full" alt="" /></div></a>        </div>     </div>     <div class="wpb_text_column wpb_content_element  vc_custom_1444179182220">        <div class="wpb_wrapper">            <h3 style="text-align: center;">Titel</h3>
        </div>     </div>     <div class="wpb_text_column wpb_content_element ">        <div class="wpb_wrapper">            <p style="font-size: 10pt;">Lorem ipsum,Lorem ipsum,Lorem ipsum</p>
        </div>     </div> <div class="vc_button-2-wrapper vc_button-2-align-center"><a class="vc_btn vc_btn_blue vc_btn-blue vc_btn_md vc_btn-md vc_btn_rounded" href="http://www.link.com" title="" target="">BUTTON!</a></div>
        </div>     </div>

    http://pastebin.com/dPkw72J4

    Einmal editiert, zuletzt von wacha (11. Oktober 2015 um 19:26)

    Hille hat mir geholfen, und das Problem ist nun gelöst.

    Hier die Lösung:
    [COLOR=#333333]Du musst .vc_column_container eine feste Größe zuweisen z.B.[/COLOR]

    [COLOR=#333333].vc_column_container {[/COLOR]
    [COLOR=#333333]height: 200px;[/COLOR]
    [COLOR=#333333]}[/COLOR]

    [COLOR=#333333]oder ganz einfach (ist zwar nicht schön, geht aber auch)[/COLOR]

    [COLOR=#333333]Wir freuen uns auf Sie![/COLOR]
    [COLOR=#333333]&nbsp;


    [/COLOR]

    height ist da nur bedingt richtig, denn das Element bekommt eine absolute Höhe. Wird der Wert überschritten, verschwindet der Inhalt oder wird aufgrund einer fehlenden overflow-Eigenschaft trotzdem verrutscht angezeigt. min-height wäre der bessere Weg, wenn auch keine optimale Lösung (wenn die Mindesthöhe überschritten wird, wird es wieder ungleichmäßig). Richtig ist die Verschachtelung der Elemente und die relative Höhenangabe des Childs.

Jetzt mitmachen!

Sie haben noch kein Benutzerkonto auf unserer Seite? Registrieren Sie sich kostenlos und nehmen Sie an unserer Community teil!

Benutzerkonto erstellen Anmelden