0

3 like kolonner CSS-rutenettoppsett

Design CSS-rutenettoppsett visuelt: angi kolonner, rader og gap, og skriv deretter områdenavn inn i celler for å bygge rutenett-mal-områder - med en direkte forhåndsvisning og kopierbar CSS og HTML.

Skriv inn et navn i en celle under; celler med samme navn smelter sammen til ett rutenett-mal-område-område.

Behandler... 0%

Resultat

Denne siden åpner rutenettgeneratorsettet til tre like brede kolonner i en enkelt rad, med navngitte områder slått av - oppsettet er bare gjenta(3, 1fr), den korteste måten å si "tre kolonner som alltid deler den tilgjengelige bredden jevnt."

Kolonner med lik bredde er arbeidshesten til kortrutenett, pristabeller og bildegallerier: ingen områder trenger navn fordi hver kolonne spiller den samme rollen, så vanlig sporstørrelse er klarere enn en deklarasjon av rutenettmal-områder. Legg til en rad og de samme tre sporene gjentas under, fortsatt perfekt jevne.

Øk kolonneantallet for et tettere rutenett, eller slå på navngitte områder hvis en senere kolonne trenger å skille seg ut fra resten - CSS og HTML nedenfor oppdateres i det øyeblikket du gjør det. Alt kjører på klientsiden, så det er ingenting å laste opp og ingenting å vente på.