• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

Abstandsdefinition bei Responsive Design

NetAktiv

Senior HTML'ler
Hallo,

nehmen wir an, ich wollte (zumindest für Desktop Bildschirme) für einen Bereich #data meiner Seite beispielsweise für ein Formular folgendes Layout: rechts und links jeweils 150px leer und in der Mitte zentriert die Daten. Beim alten Design wusste ich die totale Fensterbreite mit 1000px und habe das wie folgt gelöst:

HTML:
#data { width: 700px; margin: 0 auto}

dieser Ansatz mit festen Breiten fällt natürlich nun aus. Was wäre denn beispielsweise mit Bootstrap die korrekte oder beste Lösung. Unter beste meine ich, dass der leere Platz an den Seiten möglichst so lange reduziert wird, bevor ein Umbruch passiert. Ich sehe folgende Möglichkeiten
  1. #data { width: 70%; margin: 0 auto}
  2. #data { padding-left:15%; padding-right:15% }
  3. #data { width: 70%; margin-left: 15%}
  4. class=row und darin Zeile breite=8 Zellen, Offset 2, darin die #data
  5. Man lässt so etwas ganz und nutzt immer die volle Breite
Grüße, Rainer
 
Werbung:
Code:
.data { max-width: 700px; margin: 0 auto}
Würde ich mal sagen. Kommt sich natürlich darauf an was du mit dem Element vor hast.
Wobei ich statt px lieber rem oder em verwende.
 
Hallo Scabik,

ich dachte width-Angaben mit px seien nicht erlaubt, aber das bezieht sich dann scheinbar nur auf feste Werte, nicht auf max. em scheint ja geeigneter zu sein, wenn man zoomen will, danke für den Hinweis
 
Werbung:
Zurück
Oben