# 92: Bygg de individuelle gallerisidene - CSS-triks

Anonim

Vi har litt Photoshop-mockup å jobbe herfra mens vi fortsetter å bygge malen for den enkelte gallerisiden.

Først stilte vi opp koblingene Neste og Forrige. De er i en absolutt plassert rute i galleribaren, slik at vi kan sentrere dem på siden til tross for de andre knappene og tingene som allerede er i baren. De tar samme klasse som Submit One-knappen, så det er konstant der.

Neste gang har vi denne meget slanke venstre kolonnen for å få tekst. Vi starter med et 1/8 7/8 rutenett, men 1/8 er bare litt for slankt. Vi endrer den til 1/4 3/4, men det er for mye. Så som den sagnomsuste babybjørnen, var 1/6 5/6 helt riktig.

Vi gjør litt typografiarbeid i den smale kolonnen, og legger til tittelen (i en

tag selvfølgelig, siden det er den viktigste tittelen på siden), beskrivelsen og andre seksjoner. Det meste av typografien faller bare på plass basert på vårt enkle og solide typografioppsett.

5/6 rutenettet er alt for bildet. Fin og stor, noe som er flott. Den har en lys grå bakgrunn, akkurat som hvordan bilder har i blogginnlegg (f.eks

).

Vi tenker på å bli litt fancy med hvordan vi styler kodene. Vi ser oss rundt på CodePen (her er en lenke til "tags" -koden, META ALERT). Vi ender med å tenke at det er for mye og la dem være som normale lenker.

Vi får “full størrelse” -knappen til å fungere på en av de enkleste måtene vi kan, åpne et nytt vindu som er dimensjonene til bildet i full størrelse og viser bildet i det. Det er som en modalboks fra begynnelsen av 2000-tallet! Men jeg liker det. Det er enkelt, det trenger ikke en haug med kode (som en lysboks ville), og det er åpenbart å samhandle med. Det er enda bedre hvis du spør meg.