Yesterdayishere.com » CSS trikovi i hackovi

CSS trikovi i hackovi

Web dizajn - 31/12/2004 at 16:20 CET

U globalu sam protiv razno-raznih hackova i nastojim pisati što čišći HTML i CSS kôd. Ipak, postoje trikovi kojima se redovito služim. Iako su neki od njih uglavnom dodatni kôd, koji bi u svijetu koji mari za standarde bio suvišan, oni su nužni želimo li nešto prikazati kako smo zamislili. Drugi su pak korisni i čine rad ugodnijim. Popis slijedi.

The IE Doubled Float-Margin Bug

U ovom članku, opisan je jedan od mnogobrojnih bugova u IE-u. Marginu od 100 pixela IE pokazuje kao 200 pixela. Trik je krajnje jednostavan i dodavanje {display: inline;} elegantno rješava problem.

Univerzalni selektor

Korištenje univerzalnog CSS selektor * olakšava posao jer obuhvaća svaki element na stranici. Dakle, definiranjem * { font-style: italic }, sav tekst će biti u kurzivu.

@ import

Iako je ovaj hack za prastare browsere poput Netscapea 4, nije zgoreg koristi se njime, a modernom browseru je svejedno hoćete li style sheet pozvati ovako ili preko<link> taga.

Float clearing problem

Problem oko clearinga floatanog sadržaja može se riješiti čistim CSS-om, što je dokumentirano u ovom članku. Problemi sa IE-om mogu se ispraviti dodatnim CSS hackom, pa cijelu stvar izbjegavam i kao rješenje problema ubacim nešto poput ovog:

<div style="clear:both;"></div>

Centriranje block-level elementa

IE prije verzije 6.0 pogrešno interpretira body { text-align: center } i centrira i DIV sadržaj u njemu. Rješenje je dodati text-align: left za DIV u pitanju.

Image replacement tehnika

U moru ovakvih tehnika, valja samo izabrati ili osmisliti svoju. Želite li znati kojom se ja služim, zavirite u moj CSS kôd.

2 Responses

  1. odlična stranica i jako dobar članak:)

    Author: Marko, March 29th, 2005 at 2:24

  2. Prije svega sviđa mi se dizajn.
    Nadalje i ideja sitea, no ne i realizacija te ideje.
    Prvo šta napravim kad me neki site oće poslat za neki članak na taj drugi sajt, stisnem onaj mali crveni X.

    Budi detaljniji!

    Pozz ;)

    Author: 108-d, February 3rd, 2008 at 12:47

Leave a Reply

Please Note: Your e-mail address is required, but never displayed. Your comment must be approved before it is displayed, so please do not post more than once.

XHTML: You can use these tags: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <code> <em> <i> <strike> <strong>