automatische spaties in css

Overzicht Reageren

Sponsored by: Vacatures door Monsterboard

- Diov -

- Diov -

18/02/2012 15:04:33
Quote Anchor link
Beste,
als ik voorbeeld <h3> toepas, en daarachter wil ik voorbeeld ene <h4> dan heb ik een probleem.

als ik die <h3> toepas, is er een automatische spatie, regelafstand.
Waar in de code kan ik die eruit halen?

Code (php)
PHP script in nieuw venster Selecteer het PHP script
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
115
* { margin:0; padding:0;}
body { background:url(images/tail-top.gif) repeat-x top #fff; font-family:Tahoma, Geneva, sans-serif; font-size:100%; line-height:1em; color:#414141;}

input, textarea, select { font-family:Tahoma, Geneva, sans-serif; font-size:1em;}

object { vertical-align:top;}

.fleft { float:left;}
.fright { float:right;}
.clear { clear:both;}

.alignright { text-align:right;}
.aligncenter { text-align:center;}

.wrapper { width:100%; overflow:hidden;}
.container { width:100%;}

p { margin:0; padding:0;}

.tail-top-right { position:absolute; right:0; top:0; width:50%; height:285px; background:url(images/tail-top-right.gif) repeat-x right top;}


/*==================forms====================*/
input, select { vertical-align:middle; font-weight:normal;}
img {border:0; vertical-align:top; text-align:left;}

#contacts-form { clear:right; width:100%; overflow:hidden;}
#contacts-form fieldset { border:none; float:left; }
#contacts-form .field { clear:both;}
#contacts-form label { float:left; width:97px; line-height:18px; padding-bottom:8px; font-weight:bold; color:#4c7cbd;}
#contacts-form input { width:170px; padding:1px 0 1px 3px; background:url(images/png-bg.png) left top; border:1px solid #d6d6d6; color:#414141; float:left;}
#contacts-form textarea { width:539px; height:252px; padding:1px 0 1px 3px; background:url(images/png-bg.png) left top; border:1px solid #d6d6d6; color:#414141; margin-bottom:15px; overflow:auto; float:left;}


/*==================list====================*/
ul { list-style:none;}

.site-nav { width:100%; overflow:hidden; padding-top:15px;}
.site-nav li { float:left; font-weight:bold; border-right:1px solid #d5d5d5; padding:0 73px 4px 73px;}
.site-nav li a { color:#000;}
.site-nav li a:hover,
.site-nav li a.act {
    color:#4c7cbd;
}
.site-nav li.last { border:0;}

.list li { background:url(images/line.gif) repeat-x bottom; padding-bottom:8px; margin-bottom:6px;}
.list li span { display:inline-block; padding-left:22px; background:url(images/marker-1.gif) no-repeat left 3px;}
.list li a { color:#414141;}
.list li.last { background:none; padding-bottom:0; margin-bottom:0;}

.list1 li { width:100%; overflow:hidden; vertical-align:bottom; padding:3px 0 20px 0;}
.list1 li img { float:left; margin:-3px 15px 0 0;}
.list1 li.last { padding-bottom:0;}

.list2 { padding-bottom:15px;}
.list2 li { padding:0 0 4px 8px; background:url(images/marker-2.gif) no-repeat left 6px;}
.list2 li a { color:#4c7cbd;}
.list2 li ul { padding-top:4px; margin-bottom:-4px;}
.list2 li ul li { padding-left:8px; background:url(images/marker-3.gif) no-repeat left 6px;}



/*==================other====================*/
.img-box1 { width:100%; overflow:hidden; padding-top:3px;}
.img-box1 img { float:left; margin:-3px 15px 0 0;}

.p1 { margin-bottom:14px;}


/*==================txt, links, lines, titles====================*/
a {color:#414141; outline:none;}
a:hover{text-decoration:none;}

h3 { font-size:1em; color:#4c7cbd; margin-bottom:12px;}
h3 a { color:#4c7cbd; text-decoration:none;}
h3 a:hover { text-decoration:underline;}

.link { display:block; float:right; background:url(images/link-bgd.gif) repeat-x top; color:#4c7cbd; font-size:1em; text-decoration:none; line-height:.92em;}
.link em { display:block; background:url(images/link-left.gif) no-repeat left top;}
.link b { display:block; background:url(images/link-right.gif) no-repeat right top; padding:5px 21px 6px 21px; font-style:normal;}
.link:hover { text-decoration:underline;}

.line-hor { border-bottom:1px solid #000; margin:20px 0; overflow:hidden; font-size:0; line-height:0;}

.title { margin-bottom:18px;}


/*==================boxes====================*/
.box { background:#fff; width:100%;}
.box .border-top {background:url(images/border.gif) repeat-x top;}
.box .border-bot {background:url(images/border.gif) repeat-x bottom;}
.box .border-left {background:url(images/border.gif) repeat-y left; width:100%;}
.box .border-right {background:url(images/border.gif) repeat-y right;}
.box .inner { padding:30px 30px 40px 31px;}


/*header*/
#header .logo { position:absolute; top:137px; left:55px;}

/*content*/
#content { padding:20px 40px 0 40px;}
#content .banner { padding-top:20px;}
#content .indent { padding:14px 0 0 9px;}
#content .indent1 { padding-bottom:28px;}
#content p { line-height:1.17em;}

/*footer*/
#footer .indent { padding:37px 40px 20px 40px;}
#footer img { position:relative; top:-4px;}
#footer a { color:#4c7cbd;}

/*==========================================*/

#content .inner_copy {border:0;color:#f00;float:left;width:50%!important;margin:-202px 0 0 0;overflow:hidden;line-height:0;padding:0;font-size:12px}


Mvg,
Dem
 
PHP hulp

PHP hulp

11/01/2025 09:21:22
 
Wouter J

Wouter J

18/02/2012 16:11:10
Quote Anchor link
Regel 75:
Code (php)
PHP script in nieuw venster Selecteer het PHP script
1
h3 { font-size:1em; color:#4c7cbd; margin-bottom:12px;}

Die margin-bottom is de ruimte die er buiten het element onderin zit. Maak hier 0 van i.p.v. 12px.
 
- Diov -

- Diov -

18/02/2012 18:25:53
Quote Anchor link
@ Wouter!
Bedankt.

Ik wist dat het ergens in die regels zat maar ik ken echt niets van css.
Heb je misschien een goeie nederlandstalige toturial die alle puntjes van css opsomt?
Toch alvast bedankt.
Dem
 
Obelix Idefix

Obelix Idefix

18/02/2012 18:38:44
Quote Anchor link
Dem Ian op 18/02/2012 18:25:53:
Ik wist dat het ergens in die regels zat maar ik ken echt niets van css.

Wat houdt je dan tegen om te gaan experimenteren?
Pas wat aan en kijk wat het gevolg is......
 
- Diov -

- Diov -

18/02/2012 18:40:14
Quote Anchor link
Ja, had ik gedaan.
Maar ik wil niet dat ik alles verkloot?

Ik vraag het liever hoor ;s
 
Wouter J

Wouter J

18/02/2012 18:47:14
Quote Anchor link
Een goede nederlandse tutorial is de site http://sceneone.nl/ qua HTML loopt het al een beetje achter (maar het is nog niet echt fout wat hij doet), maar qua CSS is het zo'n beetje de beste tutorial die ik ken.

Begin bij pagina 1 en ga zo alle pagina's van de site af. Lees elke pagina en bekijk de demo's. Als je een pagina gehad hebt open je kladblok (of je editor) en ga je wat experimenteren met de dingen die je net geleerd hebt en in andere pagina's geleerd hebt.
Aan het eind van een hoofdstuk (1 hoofdstuk bevat meerdere pagina's) heeft hij altijd een slot pagina waar hij alles samenvat in een demo. Probeer na zo'n hoofdstuk een begin te maken aan je eigen test website en aan het eind heb je een goede site.

Probeer wel opgegeven moment alle CSS properties en selectors uit het hoofd te weten. Als je het telkens weer moet opzoeken kost het je echt heel veel tijd.

En onthoud: De sleutel naar een goede tutorial is niet per se de tutorial zelf, maar hoeveel je oefent met de geleerde dingen.
 
Obelix Idefix

Obelix Idefix

18/02/2012 18:51:33
Quote Anchor link
Dem Ian op 18/02/2012 18:40:14:
Ja, had ik gedaan.
Maar ik wil niet dat ik alles verkloot?

Ik vraag het liever hoor ;s

Wat een onzin. Ga je voor elke vraag die je hebt een topic starten? :s

Maak een kopie en ga daar mee oefenen/testen. Zoveel valt er dan toch niet te verkloten? Zelf ontdekken/leren is doorgaans de beste leerschool.
 
- Diov -

- Diov -

18/02/2012 18:53:02
Quote Anchor link
Ik ken niets van css, dat gaf ik toe.
Ik vraag toch een toturial om het te leren?
Als ik er niets van af weet, is het denk ik niet verstandig om eraan te beginnen.

Toevoeging op 18/02/2012 18:53:15:

Btw bedankt voor de toturial!!
 



Overzicht Reageren

 
 

Om de gebruiksvriendelijkheid van onze website en diensten te optimaliseren maken wij gebruik van cookies. Deze cookies gebruiken wij voor functionaliteiten, analytische gegevens en marketing doeleinden. U vindt meer informatie in onze privacy statement.