En hög med CSS-frågor.

7 svar · 605 visningar · startad av K@llen 7 sep. 2005

K@llenMedlem sedan mars 20032 667 inlägg

Frågan7 sep. 2005 17:56#1

1. BORDER: Jag brukar skriva så här:

	border-left:1px solid #ED9B4F;
	border-right:1px solid #ED9B4F;

Alltså definiera varje sida för sig. Jag har sett lite olika varianter på att definiera alla sidor på en gång, med en rad. På vilket sätt ska man skriva då för bäst stöd?

2. MARGIN/PADDING: Jag brukar skriva så här:

	margin-left: 5px;
	margin-top: 0px;

Man kan ju säkert skriva allt på en rad har jag sett. Hur skriver man för bäst stöd och vad anger varje siffra i turordningen?

3. CLASSER/ID FÖR ELEMENT

Exempel:

div.content {}

Definierar klassen content för elementet div.

.content div {}

Definierar klassen content för elementet div. Skillnaden mot ovanstående exempel är då?

#content.archive h4 {}

Att jag har ett id, en klass och ett element förstår jag. Men hur hör detta ihop?

zcorpanMedlem sedan dec. 20042 245 inlägg

7 sep. 2005 18:18#2

Det mesta hittar du i specen. :)

http://www.w3.org/TR/CSS21/box.html#propdef-border
http://www.w3.org/TR/CSS21/box.html#propdef-margin

Stödet för shorthand-egenskaperna är väldigt bra, så du kan använda dem utan att oroa dig.

div.content {}

...selekterar alla div-element som har ett klassnamn av "content".

.content div {}

...selekterar alla div-element som är avkomlingar (descendants) till alla element (vilket som helst) som har ett klassnamn av "content".

#content.archive h4 {}

...selekterar alla h4-element som är ättlingar av alla element med ett ID av "content" som också har ett klassnamn av "archive".

SelectORacle kan förklara selektorer. :)

MeleaMedlem sedan juli 20033 147 inlägg

7 sep. 2005 18:19#3

1 & 2: Du skriver

border: 1px 1px 1px 1px solid #000000;

Då det blir såhär: upp-vänster-ner-höger.
Du kan alltså skriva samma sak med margin/padding.

K@llenMedlem sedan mars 20032 667 inlägg

7 sep. 2005 18:24#4

Tack till er båda. :D

Jag sammanfattar zcorpans svar så här:

Ju mer jag lär mig, desto mer inser jag hur lite jag kan. ;)

fiddlerMedlem sedan juli 20023 617 inlägg

7 sep. 2005 18:25#5

Melea skrev:

1 & 2: Du skriver
border: 1px 1px 1px 1px solid #000000;
Då det blir såhär: upp-vänster-ner-höger.
Du kan alltså skriva samma sak med margin/padding.

Har du inte växlat höger och vänster? :q

zcorpanMedlem sedan dec. 20042 245 inlägg

7 sep. 2005 18:26#6

Melea skrev:

1 & 2: Du skriver
border: 1px 1px 1px 1px solid #000000;
Då det blir såhär: upp-vänster-ner-höger.
Du kan alltså skriva samma sak med margin/padding.

Jag tror inte det här är tillåtet... :)

Unlike the shorthand 'margin' and 'padding' properties, the 'border' property cannot set different values on the four borders. To do so, one or more of the other border properties must be used.

cayaMedlem sedan aug. 20051 448 inlägg

7 sep. 2005 18:30#7

för att få border runt hela - använd border:1px solid #000;
men vill man ha olika stilar för varje sida får man ha flera i css:en. nån som förstod sista meningen? ;)

K@llenMedlem sedan mars 20032 667 inlägg

12 juli 2006 22:00#8

fiddler skrev:

Har du inte växlat höger och vänster? :q

Jo, manualen för margin och padding skrev:

"If there are four values, they apply to the top, right, bottom, and left, respectively."

Om någon nu undrar samma sak som jag undrat en gång. :e