Können wir Panels für Responsive Webdesign verwenden?


8

Ich möchte eine neue Site mit Responsive Design unter Verwendung des Omega-Themas erstellen. Sind Panel-Module für Responsive Design geeignet oder sollte ich etwas anderes verwenden (wie das Context-Modul)? Vielen Dank

Antworten:



5

Ja! Ich habe es einfach gemacht.

Angenommen, 2 Farben und Varianten - für andere Layouts benötigen Sie möglicherweise mehr:

  1. In der @ media-Abfrage-CSS mit der niedrigsten Auflösung habe ich nur '.panels-col-first' und '.panels-col-last' auf gesetzt { width: 99.9%; clear: both }.
  2. Wenn Sie in Layouts mit höherer Auflösung zum 2-Spalten-Layout zurückkehren möchten, machen Sie die Überschreibung einfach rückgängig { width: 49.9%; clear: none }

Anmerkungen:

  • Die% -Breiten sollten WENIGER als 100% betragen, wenn Sie IE 6 und 7 unterstützen möchten, da diese Rundungsfehler aufweisen. Sie können dies immer in Ihrem speziellen ie.css tun, wenn Sie eines haben und diese 0,2% wirklich zurück brauchen!
  • Diese Klassen sollten bereits so eingestellt sein, dass sie vom CSS der Hauptfenster nach links schweben. Sie können dies jedoch bei Bedarf auch überschreiben.

1

Ich hatte das gleiche Problem. Keine Notwendigkeit, in CSS zu codieren, um das Problem zu beheben. -> Omega Griffbrunnen in reaktionsschnellem Design.

"Omega wird standardmäßig mit einer Handvoll Bedienfeldlayouts geliefert. Wenn Sie Bedienfelder auf Ihrer Site mit aktiviertem Omega-Thema aktivieren und ein neues Bedienfeld hinzufügen, wird das Spaltenraster Omega: 12 (oder 16 oder 24) aufgelistet Wählen Sie eines davon und dann ein Layout. Es ist mir peinlich, wie einfach es war, und ich wusste es nicht einmal! "

Ich habe die Lösung auf dieser Seite gefunden, zweiter Kommentar http://www.kendallsdesign.com/blog/omega-theme-responsive-design-resources

Übrigens gibt es wirklich gute Materialien.

Durch die Nutzung unserer Website bestätigen Sie, dass Sie unsere Cookie-Richtlinie und Datenschutzrichtlinie gelesen und verstanden haben.
Licensed under cc by-sa 3.0 with attribution required.