Aktuell bekam ich ein Layout zur \u00dcberarbeitung, in welchem die li einer Liste als Spalten fungierten. Problematik ist bei solchen Layouts, dass die Spalten (fixe Breite) sich meist nur bei einer Aufl\u00f6sung formsch\u00f6n in das Layout einpassen. Ist das Rahmenlayout fluid angelegt, werden bei kleineren Aufl\u00f6sungen weniger Spalten angezeigt, bei gr\u00f6\u00dferen mehr. Meist passt aber dann die Anzahl nicht mehr genau in den daf\u00fcr vorgesehen Bereich und es entstehen unsch\u00f6ne Leerr\u00e4ume. <\/p>\n
Die andere M\u00f6glichkeit ist mit Prozenten und statt vollst\u00e4ndig fluid mit einer begrenzten Flexibilit\u00e4t zu arbeiten. Mit geschicktem Austarieren der Breiten kann man es durchaus hin bekommen, dass die Spalten sich gleichm\u00e4\u00dfig verteilen, auch wenn es in der kleineren Aufl\u00f6sung m\u00f6glichweise weniger sind als in der gr\u00f6\u00dferen. Ist aber zugegeben etwas m\u00fchsam und verbraucht Zeit und Geduld. <\/p>\n
Auf sohtanaka.com<\/a> wird jedoch noch eine weitere M\u00f6glichkeit im Zusammenspiel mit jQuery<\/a> vorgestellt. Via jQuery wird bei fixen Breiten der entstehend Leerraum auf die Spalten gleichm\u00e4\u00dfig verteilt.<\/p>\n","protected":false},"excerpt":{"rendered":" Aktuell bekam ich ein Layout zur \u00dcberarbeitung, in welchem die li einer Liste als Spalten fungierten. Problematik ist bei solchen Layouts, dass die Spalten sich meist nur bei einer Aufl\u00f6sung formsch\u00f6n in das Layout einpassen. Ist das Rahmenlayout fluid angelegt, werden bei kleineren Aufl\u00f6sungen weniger Spalten angezeigt, bei gr\u00f6\u00dferen mehr. Meist passt aber dann die Anzahl nicht mehr genau in den daf\u00fcr vorgesehen Bereich und es entstehen unsch\u00f6ne Leerr\u00e4ume. Eine Probleml\u00f6sung kann mit jQuery erreicht werden.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[4],"tags":[14,143,267,389,390],"yst_prominent_words":[],"class_list":["post-1562","post","type-post","status-publish","format-standard","hentry","category-webdesign","tag-webdesign-2","tag-css-xhtml","tag-grid-layouts","tag-jquery","tag-spaltenlayouts"],"_links":{"self":[{"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/posts\/1562","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/comments?post=1562"}],"version-history":[{"count":1,"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/posts\/1562\/revisions"}],"predecessor-version":[{"id":4015,"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/posts\/1562\/revisions\/4015"}],"wp:attachment":[{"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/media?parent=1562"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/categories?post=1562"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/tags?post=1562"},{"taxonomy":"yst_prominent_words","embeddable":true,"href":"https:\/\/www.jukemedia.de\/blog\/wp-json\/wp\/v2\/yst_prominent_words?post=1562"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}