z-index

Ibland vill man att en div ska ligga ovanpå eller under en annan div. Det är inte alltid dom lägger sig i den ordningen som man önskar.

Genom att skriva in z-index i css'en så kan man enkelt lösa det problem.

Tänk det som att divarna ligger i olika lager, som pappersark ovanpå varandra (som i photoshop).

z-index:-1; i den aktuella div'en gör att den åker ner ett lager. Ta bort minuset och det åker upp ett lager.
lägg till position:absolute; i diven också.

Easy peasy! :)

< meta > , specialtecken

Trött på att skriva auml, ouml, aring etc?

I know I am!

Här finns tre 0lika meta-taggar att använda sig av:

• For HTML (but not in XHTML) it is possible to include this information inside the head element near the top of the document:

< meta http-equiv="Content-Type" content="text/html; charset=utf-8" >

• HTML5 also allows the following syntax to mean exactly the same:

 < meta charset="utf-8" > 

• XHTML documents have a third option: to express the character encoding via XML declaration, as follows:

    < ?xml version="1.0" encoding="ISO-8859-1"? > 

Glöm inte ta bort mellanrummen efter <>

Rundade hörn - CSS3

Att få rundade hörn har tidigare varit en h-lvetes procedur.

CSS3 to the rescue!!

Släng in följande kod i din style-sheet så kommer du att få jämna rundade hörn i neder kanterna av din div (självklart så blir det i överkanten om du ändrar 'bottom' till 'top');

-moz-border-radius-bottomleft: 10px;

border-bottom-left-radius:10px;

-moz-border-radius-bottomright: 10px;

border-bottom-right-radius:10px;

(OBS. Explorer är ju lite som den är och CSS3, och detta, fungerar tidigast i IE 9)

Centrera din sida

Centrera din sida med hjälp av DIV-taggar.
Skriv in koden margin: 0px auto; i css filen under wrapper id, dvs den div taggen som du använder för att omsluta alla andra taggar.


Style.css

#wrapper {
margin: 0px auto;
}


Piece of cake! ;D

Form: Select multiple - välj flera alternativ

En vanlig dropdown lista med en-val's-möjlighet gör man med hjälp av "select";

<select name="nåt vettigt namn">
<option>val 1</option>
<option>val 2</option>
<option>val 3</option>
<option>val 4</option>
</select>

För att kunna få den så att man kan välja flera alternativ är det inte svårare än att man lägger till det lilla ordet "multiple".

<select multiple name="nåt vettigt namn">
<option>val 1</option>
<option>val 2</option>
<option>val 3</option>
<option>val 4</option>
</select>

Detta bildar en rullista, om man har många valmöjligheter, vill man dessutom bestämma hur många alternativ som ska synas i listan åt gången, dvs hur många man ska kunna se innan men behöver skrolla så lägger man till size="antal poster som ska visa"

<select multiple size="4" name="nåt vettigt namn">