Guten morgen, Damit alles harmonischer wirken soll, würde ich gerne das Newsletterfeld vergrößern wollen oder den Anmeldebutton verkürzen. Ich habe an dem Quellcode etwas herumgespielt, leider ohne Erfolg. Hat jemand eine Idee? Lieben Dank HTML: <form action="newsletter.php" class="form-horizontal container" method="post"> <div class="row"> <div class="col-xs-12 col-md-6 col-lg-3"> <p style="margin-right: 10px;"> </p> </div> <div class="col-xs-12 col-md-6 col-lg-6"> <div class="form-group"> <div class="col-xs-12 col-sm-6 col-md-7"><input class="form-control validate" data-validator-validate="required email" name="email" placeholder="Kostenloser Newsletter - Deine E-Mail-Adresse" type="text" /></div> <div class="col-xs-12 col-sm-6 col-md-5"><input class="btn btn-primary btn-block" type="submit" value="Jetzt anmelden" /></div> </div> </div> </div> </form>
Versuchs mal damit: HTML: <form action="newsletter.php" class="form-horizontal container" method="post"> <div class="row"> <div class="col-xs-12 col-md-6 col-lg-3"> <p style="margin-right: 10px;"> </p> </div> <div class="col-xs-12 col-md-6 col-lg-6"> <div class="form-group"> <div class="col-xs-12 col-sm-6 col-md-8"><input class="form-control validate" data-validator-validate="required email" name="email" placeholder="Kostenloser Newsletter - Deine E-Mail-Adresse" type="text" /></div> <div class="col-xs-12 col-sm-6 col-md-4"><input class="btn btn-primary btn-block" type="submit" value="Jetzt anmelden" /></div> </div> </div> </div> </form>
Hallo, hab sämtliche Werte verändert. Nach links bekomme ich es garnicht verschoben. HTML: <p style="margin-right: 10px;"> </p> Wenn ich die 10px verändere, verändert sich nichts. *Cache entleert* Danke
Hallo Andrea, Du änderst an der falschen Stelle. <p>....</p> markiert einen Textbereich Ich versuche mal den Code von Torben zu entwirren Code: <div class="col-xs-12 col-md-6 col-lg-3"> <p style="margin-right: 10px;"> </p> </div> Das erstellt einen block, von 3 Gridspalten breite, indem aber nur ein Leerzeichen ist. Code: <div class="col-xs-12 col-md-6 col-lg-6"> <div class="form-group"> <div class="col-xs-12 col-sm-6 col-md-8"><input class="form-control validate" data-validator-validate="required email" name="email" placeholder="Kostenloser Newsletter - Deine E-Mail-Adresse" type="text" /></div> <div class="col-xs-12 col-sm-6 col-md-4"><input class="btn btn-primary btn-block" type="submit" value="Jetzt anmelden" /></div> </div> </div> Das ist der eigentliche Newsletter. in solchen Zeilen werden die ganzen Gridspalten festgelegt. Code: <div class="col-xs-12 col-md-6 col-lg-6"> col-xs ist für Smartphones, col-md für Tablets im Querformat und col-lg für PC Wenn Du jetzt diese Zeile von dem oberen Block Code: <div class="col-xs-12 col-md-6 col-lg-3"> änderst, auf Code: <div class="col-xs-12 col-md-6 col-lg-2"> rutscht der ganze Newsletter um ein zwölftel nach links. jetzt dürfte der ganze Block etwas zu weit links sein, das kann man dann mit margin-left: 15px; weiter nach rechts verschieben. Wie der Code dann genau heist, muss man sich bei dir ansehen. ich tippe auf #footer .form-group .form-control, { margin-left: 15px; } bin aber nicht sicher,
Code: #footer .form-group .form-control, { margin-left: 15px; } Den hatte ich garnicht im CSS drin.......Lieben Dank.
Bin mit meinen Nerven am Ende. - von Torben Html code übernommen - von Barbara CSS Code übernommen ich weiß nicht mehr weiter..... Code: Code: #footer .form-group .form-control, { margin-left: 15px; } ändere ich hier 15px auf X, dann passt die Ansicht v. Smartphone nicht mehr.