CSS Bootstrap grid anpassen

tomasu

Aktives Mitglied
Thread Starter
Dabei seit
21.06.2006
Beiträge
852
Reaktionspunkte
0
Moin Leutz

Ich hoffe, ich habe den Betreff richtig gewählt.
Ich habe folgendes Problem und versucht über das Internet eine Antwort zu finden. Ich habe auch mehrere Male versucht Selbst Hand anzulegen, aber leider vergeblich. Auf der Webseite kann man das Problem sehen. Es gibt viel zu viel Platz zwischen den Textenabschnitten. Es liegt daran, das in einem Teil ein sehr langer Text ist, und alles richtet sich daran aus.
Meine Frage: Wie kann ich das individuell anpassen?
Ich lese mich auch gerne ein, oder beschäftige mich gern, wenn ich weiß an welchen Bereichen ich arbeiten soll.
Ich hoffe, das sind genug an Infomationen.

http://www.skill-access.com/ourservice.html

Code sieht für alle Bereiche gleich aus:
HTML Code:
HTML:
<div class="container">
        <div class="row">
          <div class="grid_3">
        
            <h3>Our Service</h3>
            <h4>Decide your way</h4>
            <hr>
          </div>
          <div class="grid_9">
            <ul class="row product-list center-mobile">
          
            <li class="grid_3 wow fadeInRight" data-equal-group="3">
                <h4>For Corporate</h4>
                <p>
                  Corporate classes will be held at your company and can be tailor-made. For more information, please <a href="contact.html">CONTACT</a> us.   </p>
                   <h4 data-equal-group="5">Tailor-made example</h4>
                  <p>Business: 10 times</p>
                    <p> Negotiation: 5 times</p>
                   <p>  Communication Skills: 5 times</p>
                    <p> Telephone and Email Training: 5 times</p>
              </li>
          
             <li class="grid_3 wow fadeInRight" data-equal-group="4">
                <h4 data-equal-group="1">For Students</h4>
                <p>
                  Classes for students will be held at our office and are fixed at a duration of 10 times. The minimum number of participants is six (6) people. For more information, please <a href="contact.html">CONTACT</a> us.              </p>
              </li>
              <li class="grid_3 wow fadeInRight" data-equal-group="4">
                <h4 data-equal-group="1">For Kids</h4>
                <p>
                  We offer special classes and skills for children.      </p><p>
                 For more information, please <a href="contact.html">CLICK</a> here.
                </p>
                <p>
                  summer, spring,               </p>
              </li>
        </ul>
          </div>
       </div>
       </div>

CSS Code:
HTML:
.container-fluid .grid_3 {
  width: 25%;

.container-fluid .preffix_3 {
  margin-left: 25%;

.container .grid_3 {
  width: 270px;
}

.container .preffix_3 {
  margin-left: 330px;
 
Zuletzt bearbeitet von einem Moderator:
Hat niemand einen Rat oder Vorschlag was ich machen könnte , um mein Problem zu lösen?
 
Irgendein Script bringt die LI teilweise auf eine Höhe oder (equalheits.js)? Da ist glaub ich was falsch.
Dazu kommt das jede section padding-bottom UND padding-top hat, klar geht dann der abstand weit auseinander.

Würde eher mit dem sibling selector arbeiten:
main section.well + section.well { padding-top: 100px; }

Dann hast du auch nicht das Problem das unten die letzte section ebenfalls einen zu großen abstand nach unten hat.

Das Gleiche würde ich bei den grid_* machen.
 
wakethedead, vielen dank.
werd mich da auf jeden fall durcharbeiten.

Danke noch mal

viele Grüße
tomasu
 
Zurück
Oben Unten