Egy weboldal sokszor elég összetett, főképp ha nem magunk készítettük, nem mindig tudjuk, hogy egy-egy elemre hogyan lehetne hivatkozni, hogy változtathassunk rajta. Sokan nem tudnak az oldal forráskódjával mit kezdeni, annak ellenére, hogy a böngészőben ott van erre a remek funkció. 

Évek óta ott van a Chrome-ban pl. az Inspect funkciója, de a Mozilla is rendelkezik vele, és szerintem talán már az IE is. (bevallom ennek nem néztem utána). Az inspect-tel megnézhetjük egy adott elem helyzetét a forráskódban. Hatékonyan kereshetünk benne, illetve azt is megnézhetjük, hogy milyen CSS tulajdonságokkal rendelkezik egy adott elem.

Sajnos az utóbbi két hétben nem nagyon tudtam az oldallal foglalkozni, mivel rengeteg zh volt, nagyon sokat kellett tanulnom. Kedden kezdődik a vizsgaidőszak, és két vizsgám már lesz is a héten, úgyhogy sok frissítés továbbra sem lesz, de ha végre lement ez az egész, akkor belehúzok :)

Most egy kis trükköt hoztam, amivel a két oldalsáv egymás mellé helyezhető. Ez igazából egyszerű css kóddal megoldható, csak float-ot kell beállítani a hasáboknak.

.sitemain .sitecol:first-child, .sitecol:nth-child(3){
float: left;
}

.sitemain .sitecol:nth-child(2){
float: right;
}

Ez a két oldalsávot balra, míg a középsőmodult jobbra állítja. Természetesen az értékek felcserélhetők.

Most egy olyan kódot hoztam nektek, amellyel egy 'CSS váltót' készíthettek. CSS kódokkal foglalkozó oldalakra szuper, hiszen enélkül nem nézhető át a teljes oldal élőben, hogy hogy is fog kinézni. Igy viszont nem kell többé próbamodulokkal, esetleg próbaoldalakkal küzedeni, egyetlen kattintásra megváltoztatható az oldal kinézete.

Aki ki szeretné próbálni, az itt megteheti: CSS váltó demó (A példa css kódokért köszönet Efruse-nak)

A kód a bővebben rész után található.