[CSS] voor dummies - Deel 2 | Digital Corner (DIG)

zaterdag 11 juni 2005 @ 22:16:00 #151

SuperRembo

Sinds 1998

quote:
Op zaterdag 11 juni 2005 13:17 schreef Leshy het volgende:
[...] * html werken, wat incorrecte CSS is omdat je hiermee zegt: "alles binnen het element html, wat een kind is van welk ander element dan ook", wat per definitie fout is omdat html het root element is, daar zit niets meer boven.[...]

* html is geen foute css, er zijn alleen geen elementen die er aan voldoen.

Hier vond ik een mooi overzicht van alle css hacks.

zaterdag 11 juni 2005 @ 22:19:45 #152

Leshy

Held met sokken.

quote:
Op zaterdag 11 juni 2005 22:16 schreef SuperRembo het volgende:
* html is geen foute css, er zijn alleen geen elementen die er aan voldoen.

Syntactisch is de CSS mogelijk correct, maar aangezien de html-tag per definitie nooit een parent element kan hebben, is het gebruik ervan wel degelijk fout

zaterdag 11 juni 2005 @ 22:40:44 #153

SuperRembo

Sinds 1998

Het is echt correcte css. Het enige wat fout is, is dat IE wel elementen denkt te vinden die er aan voldoen.

quote:
In valid HTML and XHMTL documents html is always the root element and body is always a child of the root element, and never a grandchild (or great grandchild). Therefore, the first 3 CSS selectors above should not match any element. Nonetheless, they are valid selectors.

bron (de ontdekker van deze bug)

dinsdag 14 juni 2005 @ 13:43:05 #154

DutchBlood

quote:
Op vrijdag 10 juni 2005 20:50 schreef DutchBlood het volgende:
Ik ben ook weer aan het cssen.
Het gaat om deze site: http://matthijs.info/rmrt/

Ik heb 2 div's naast elkaar. #vakjes en #content, ik krijg alleen de grijze lijn in IE niet weg.

Padding: 0xp;
Opgeven heeft geen nut.

Iemand enig idee hoe ik dit oplos, behalve nog een andere div er achter te maken met dezelfde achtergrond?

Anyone?

dinsdag 14 juni 2005 @ 17:01:44 #155

Leshy

Held met sokken.

quote:
Op zaterdag 11 juni 2005 22:40 schreef SuperRembo het volgende:
Het is echt correcte css.

Zoals ik al zei, syntactisch is het inderdaad correct

donderdag 16 juni 2005 @ 19:54:01 #156

markiemark

FR 1908

hoe maak ik text met css ook al weer met schaduw of anti alias of zo? is daar een reference voor?

Amsterdam, stad van hash en coke,
Waar de vrouwen zich vrouwelijk gedragen..
En de mannen ook..

donderdag 16 juni 2005 @ 20:03:49 #157

SuperRembo

Sinds 1998

quote:
Op donderdag 16 juni 2005 19:54 schreef markiemark het volgende:
hoe maak ik text met css ook al weer met schaduw of anti alias of zo? is daar een reference voor?

Ik denk dat je IE-filters bedoeld. Ik heb nooit zoiets gezien dat cross-browser werkt.

vrijdag 17 juni 2005 @ 01:07:22 #158

curry684

Windowshippie

quote:
Op donderdag 16 juni 2005 19:54 schreef markiemark het volgende:
hoe maak ik text met css ook al weer met schaduw of anti alias of zo? is daar een reference voor?

Antialiasing zit niet in CSS. Shadows zitten in CSS3 geloof ik, en werkt dus nergens. Je kunt met CSS2 of 2.1 selectors overigens shadows goed faken, maar die kent IE weer niet. Shadows zijn sowieso lilluk overigens

Omines.

vrijdag 17 juni 2005 @ 01:08:40 #159

curry684

Windowshippie

Zie overigens A List Apart voor alle bekende methodes om drop shadows te maken.

Omines.

vrijdag 17 juni 2005 @ 12:17:03 #160

wonko

Fap

Misschien is het al gevraagd maar kan ik het niet vinden. Een zeer goed boek of site om met CSS aan de slag te gaan? Basiskennis is aanwezig maar wil het veel verder uitdiepen.

Geloven is zeker weten dat je het niet weet.
Geloven maakt meer kapot dan je lief is.
Vloeken is aangeleerd...geloven ook.

vrijdag 17 juni 2005 @ 18:46:48 #161

SqueaK

"Pis nooit tegen de wind

quote:
Op vrijdag 17 juni 2005 12:17 schreef wonko het volgende:
Misschien is het al gevraagd maar kan ik het niet vinden. Een zeer goed boek of site om met CSS aan de slag te gaan? Basiskennis is aanwezig maar wil het veel verder uitdiepen.

ik zelf vind dit wel een fijne site: http://www.bitstorm.org/edwin/cursus/css.html

vrijdag 17 juni 2005 @ 18:48:39 #162

SqueaK

"Pis nooit tegen de wind

ik ben een site op aan het bouwen helemaal uit <div>

alleen wil ik in een bepaalde div een achtergrond image... daarvoor gebruik ik dan in de opmaak dit:

1	background: #0A7CB4 url(images/image.jpg) repeat-x fixed right;

in IE werkt het perfect, maar in FF niet echt.... hoe werkt het zodat in FF ook goed is..

vrijdag 17 juni 2005 @ 19:43:52 #163

SuperRembo

Sinds 1998

quote:
Op vrijdag 17 juni 2005 18:48 schreef SqueaK het volgende:
ik ben een site op aan het bouwen helemaal uit <div>

alleen wil ik in een bepaalde div een achtergrond image... daarvoor gebruik ik dan in de opmaak dit:
[ code verwijderd ]

in IE werkt het perfect, maar in FF niet echt.... hoe werkt het zodat in FF ook goed is..

In IE werkt het niet perfect, want IE kent geen background-position: fixed

Ik denk dat je "fixed" weg moet laten om te krijgen wat je wil.

zaterdag 18 juni 2005 @ 06:24:31 #164

SqueaK

"Pis nooit tegen de wind

quote:
Op vrijdag 17 juni 2005 19:43 schreef SuperRembo het volgende:

[..]

In IE werkt het niet perfect, want IE kent geen background-position: fixed
Ik denk dat je "fixed" weg moet laten om te krijgen wat je wil.

klopt idd...

nu het volgende ... :

ik heb zo 8 pagina's waar ik dit wel hebben, maar dan 8 keer met een verschillende image...

kan ik nu het beste 8 verschillende stylesheets maken waarin ik alleen steeds de naam van de image heb veranderd, of kan ik beter in 1 stylesheet 8 id's aanmaken ?

zaterdag 18 juni 2005 @ 10:13:08 #165

SuperRembo

Sinds 1998

8 verschillende id's. Je wil echt geen 8 verschillende stylesheets onderhouden.

Wat je ook kan doen is de body een id geven.

1
2
3
4
5
6
7
8
9
10
11

#title {
    background-color: #ccf;
    background-repeat: repeat-x;
    background-position: right;
}
#introPage #title {
    background-image: url(img/intro.jpg);
}
#someOtherPage #title {
    background-image: url(img/otherimage.jpg);
}

#introPage en #someOtherPage zijn dan id's van de body op verschillende pagina's. Als je dan nog andere elementen per pagina wil aanpassen dan hoef je geen id's aan te passen.

zaterdag 18 juni 2005 @ 12:02:12 #166

SqueaK

"Pis nooit tegen de wind

quote:
Op zaterdag 18 juni 2005 10:13 schreef SuperRembo het volgende:
8 verschillende id's. Je wil echt geen 8 verschillende stylesheets onderhouden.

Wat je ook kan doen is de body een id geven.
[ code verwijderd ]

#introPage en #someOtherPage zijn dan id's van de body op verschillende pagina's. Als je dan nog andere elementen per pagina wil aanpassen dan hoef je geen id's aan te passen.

hmm dat verneukt heel de layout.... ziet er niet meer uit nu

zondag 19 juni 2005 @ 22:19:58 #167

curry684

Windowshippie

quote:
Op vrijdag 17 juni 2005 18:48 schreef SqueaK het volgende:
ik ben een site op aan het bouwen helemaal uit <div>

Jij hebt het dus niet gesnapt.

HTML met CSS is een manier om semantisch correct gebouwde sites mee te stylen waardoor semantiek en content enerzijds en presentatie en layout anderzijds strak gescheiden blijven. Enkel <div> gebruiken is dus gewoon pointless, en dan heb je het niet gesnapt.

KLIK VOOR VERPLICHT LEESVOER.

Omines.

zondag 19 juni 2005 @ 23:04:37 #168

SuperRembo

Sinds 1998

quote:
Op zaterdag 18 juni 2005 12:02 schreef SqueaK het volgende:

[..]

hmm dat verneukt heel de layout.... ziet er niet meer uit nu

Ik doe niets bijzonders. Als je 't goed toepast dan verneukt het zeker de layout niet.

maandag 20 juni 2005 @ 13:26:32 #169

SqueaK

"Pis nooit tegen de wind

quote:
Op zondag 19 juni 2005 23:04 schreef SuperRembo het volgende:

[..]

Ik doe niets bijzonders. Als je 't goed toepast dan verneukt het zeker de layout niet.

ik heb dit als code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114

/********************************************* Basis */
body {
   margin-top: 10px;
   background-image: url(images/achtergrond_algemeen.jpg);
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 8.5pt;
   color: white;
   line-height: 16px;
   text-align: center;
}

h1 {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 8.5pt;
   color: white;
   font-weight: bold;
}

a {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 8.5pt;
   text-decoration:none;
   color: #EE9700;
}

a:hover {
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 8.5pt;
   text-decoration:underline;
   color: #EE9700;
}

/********************************************* Content */
#container {
   width: 700px;
   text-align: left;
   margin: auto auto 30px auto;
   border: 0px;
   padding: 0px;
}

#kop {
   margin-left: auto;
   position: absolute;
   width: 700px;
   height: 80px;
   background-color: red;
}

#left_blank
{
   margin-left: 0px;
   margin-top: 80px;
   position: absolute;
   width: 10px;
   height: 100%;
}

#left_border
{
   margin-left: 10px;
   margin-top: 80px;
   position: absolute;
   width: 28px;
   height: 100%;
   background: url(images/side_left.jpg);
}

#middle
{
   margin-left: 38px;
   margin-top: 80px;
   position: absolute;
   width: 624px;
   background: #0A7CB4 no-repeat right;
}

.overpartybike #middle {
    background-image: url(images/image_overpartybike.jpg);
    height: 100%;
}

.prijzen #middle {
    background-image: url(images/image_prijzen.jpg);
    height: 100%;
}

#right_border
{
   margin-left: 662px;
   margin-top: 80px;
   position: absolute;
   width: 28px;
   height: 100%;
   background: url(images/side_right.jpg);
}

#right_blank
{
   margin-left: 690px;
   margin-top: 80px;
   position: absolute;
   width: 10px;
   height: 100%;
}

#onder {
   background: url(images/onder.jpg);
   margin-left: 10px;
   margin-top: 480px;
   width:680px;
   height: 22px;
   position: absolute;
}

en dan is dit het resultaat

maandag 20 juni 2005 @ 15:37:40 #170

curry684

Windowshippie

quote:
Op maandag 20 juni 2005 13:26 schreef SqueaK het volgende:
en dan is dit het resultaat

Dude, die <map> moet gewoon een <ul> van <li> elements zijn die je styled in de CSS zodat ze er als een horizontaal grafisch menu uitzien. Je bent nu namelijk alsnog grafische meuk in je HTML aan het zetten, en dan kun je net zo goed geen CSS gebruiken.

Ik zie ook aan je divs nu al dat je table-based gaat layouten maar dan met andere tags....

Omines.

maandag 20 juni 2005 @ 23:57:35 #171

markiemark

FR 1908

ok ik heb twee problemen met mn tabel...

1. centreren.. ik kan mn tabel centreren (met <table align="center">), maar op het moment dat de pagina langer wordt dan in beeld past, komt er een scrollbalk waardoor de pagina een stukje naar links wordt geschoven... hoe voorkom ik dit???

2. max hoogte bepalen... heb mijn site gemaakt op basis van tabellen. nu is de frontpage niet zo heel groot, dus is niet zo groot verticaal gezien. als ik een subpagina oproep, wordt de pagina langer, en wordt dus langer dan het scherm aan kan zonder scrollbalken.. hoe kan ik de site verticaal maximaliseren, maar wel zo dat de site zich aanpast als de site langer is dan de verticale lengte??

Amsterdam, stad van hash en coke,
Waar de vrouwen zich vrouwelijk gedragen..
En de mannen ook..

dinsdag 21 juni 2005 @ 23:07:27 #172

WalfredGeesink

De vrachtwagenchauffeur.

dat centreren lukt mij niet altijd even goed met dat css. div's met een fixed width/height lukt prima maar nu heb ik er 1tje met een width/height die niet bekend is. dit is mijn html code:

1
2
3
4
5

<body>
<div>
<p>blabla</p>
</div>
</body>

de hoeveelheid tekst in p verschilt, dus de hoogte verandert ook steeds. ik wil die div steeds gecentreerd houden.

voor het horizontaal centreren bedacht ik als oplossing text-align: center; (bij body) dat werkt prima maar het verticaal centreren lukt niet. iemand een idee?

walfredgeesink.nl/fm

dinsdag 21 juni 2005 @ 23:29:15 #173

bartjeuh

Is het mogelijk om in de style.css ook de content van een div te veranderen?

Het maken van div's op men site lukt wel maar nu wil ik daar tekst in krijgen dmv een andere file...

1
2
3
4
5
6
7
8
9
10
11

#3 {
   margin-left: 4px;
   margin-top: 0px;
   margin-right: 4px;
   width: 250px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #FFFFFF;
}

<div id="3">content</div>

Ik dacht dus aan dat maar werkt niet

[ Bericht 31% gewijzigd door bartjeuh op 21-06-2005 23:44:58 ]

woensdag 22 juni 2005 @ 09:07:05 #174

DutchBlood

quote:
Op dinsdag 21 juni 2005 23:29 schreef bartjeuh het volgende:

Is het mogelijk om in de style.css ook de content van een div te veranderen?

Het maken van div's op men site lukt wel maar nu wil ik daar tekst in krijgen dmv een andere file...
[ code verwijderd ]

Ik dacht dus aan dat maar werkt niet

Niet dmv (alleen) css.

De enige manier is wellicht de tekst in een achtergrondplaatje stoppen en dat dan via css setten.

woensdag 22 juni 2005 @ 09:08:26 #175

DutchBlood

quote:
Op dinsdag 21 juni 2005 23:07 schreef WalfredGeesink het volgende:
dat centreren lukt mij niet altijd even goed met dat css. div's met een fixed width/height lukt prima maar nu heb ik er 1tje met een width/height die niet bekend is. dit is mijn html code:
[ code verwijderd ]

de hoeveelheid tekst in p verschilt, dus de hoogte verandert ook steeds. ik wil die div steeds gecentreerd houden.

voor het horizontaal centreren bedacht ik als oplossing text-align: center; (bij body) dat werkt prima maar het verticaal centreren lukt niet. iemand een idee?

Geef de div vertical-align: middle; mee.
http://www.w3schools.com/css/pr_pos_vertical-align.asp

Forum Opties
Forumhop:
Hop naar:	(afkorting, bv 'KLB')

[CSS] voor dummies - Deel 2

» digital corner

» digital corner