Afstand (interlinie) tussen twee regel te groot
Ik zit met het probleem dat de interlinie tussen twee regels op het scherm te groot zijn. Dit volgens onderstaancde code:
Code (php)
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
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
<div class="container">
<?php while($row=mysql_fetch_array($ResultConcert)){ ?>
<?php
$cDatum = $row['datum'];
$cAanvang = $row['tijdstip'];
$cOmschrijving = $row['omschrijving'];
$cTheater = $row['theater'];
$nStoelen = $row['aantal_stoelen'];
$nGereserveerd = $row['gereserveerd'];
?>
<div class="box12zwart">
<p class="witte_tekstregel"> <?php echo $cDatum ; ?></p>
</div>
<div class="box12zwart">
<p class="witte_tekstregel"> <?php echo $cAanvang . " uur" ; ?></p>
</div>
<div class="box25zwart">
<p class="witte_tekstregel"> <?php echo $cOmschrijving ; ?></p>
</div>
<div class="box25zwart">
<p class="witte_tekstregel"> <?php echo $cTheater ; ?></p>
</div>
<div class="box25zwart">
<p class="witte_tekstregel"> <?php echo $nStoelen ." / ".$nGereserveerd ; ?></p>
</div>
<?php } ?>
</div>
<?php while($row=mysql_fetch_array($ResultConcert)){ ?>
<?php
$cDatum = $row['datum'];
$cAanvang = $row['tijdstip'];
$cOmschrijving = $row['omschrijving'];
$cTheater = $row['theater'];
$nStoelen = $row['aantal_stoelen'];
$nGereserveerd = $row['gereserveerd'];
?>
<div class="box12zwart">
<p class="witte_tekstregel"> <?php echo $cDatum ; ?></p>
</div>
<div class="box12zwart">
<p class="witte_tekstregel"> <?php echo $cAanvang . " uur" ; ?></p>
</div>
<div class="box25zwart">
<p class="witte_tekstregel"> <?php echo $cOmschrijving ; ?></p>
</div>
<div class="box25zwart">
<p class="witte_tekstregel"> <?php echo $cTheater ; ?></p>
</div>
<div class="box25zwart">
<p class="witte_tekstregel"> <?php echo $nStoelen ." / ".$nGereserveerd ; ?></p>
</div>
<?php } ?>
</div>
De codes uit de CSS zijn:
Code (php)
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
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
div.container {
width: 990px;
border:1em solid;
margin-left: auto;
margin-right: auto;
background-color: black;
border-color: black;
}
div.box12zwart {
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
width:12%;
border: 0.25em solid black ;
float:left;
font-family: Arial;
color: white;
}
div.box25 {
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
width:25%;
border: 0.25em solid #E0E1DD ;
float:left;
font-family: Arial;
color: white;
}
div.box25zwart {
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
width:25%;
border: 0.25em solid black ;
float:left;
font-family: Arial;
color: white;
}
.witte_tekstregel {
border-style: none;
border-width: 0px;
color: white;
font-family: Arial;
font-size: 14px;
font-style:normal;
font-weight:normal;
}
width: 990px;
border:1em solid;
margin-left: auto;
margin-right: auto;
background-color: black;
border-color: black;
}
div.box12zwart {
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
width:12%;
border: 0.25em solid black ;
float:left;
font-family: Arial;
color: white;
}
div.box25 {
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
width:25%;
border: 0.25em solid #E0E1DD ;
float:left;
font-family: Arial;
color: white;
}
div.box25zwart {
box-sizing:border-box;
-moz-box-sizing:border-box; /* Firefox */
-webkit-box-sizing:border-box; /* Safari */
width:25%;
border: 0.25em solid black ;
float:left;
font-family: Arial;
color: white;
}
.witte_tekstregel {
border-style: none;
border-width: 0px;
color: white;
font-family: Arial;
font-size: 14px;
font-style:normal;
font-weight:normal;
}
Wie kan/wil mij helpen met een tip hoe ik de afstand tussen twee regels kan verkleinen?
George
Wat doet daar?
Waarom op regel 1 php afsluiten en direct daarna weer openen?
Geef een waarde mee aan <p> om de hoogte te bepalen.
Gewijzigd op 09/05/2012 19:29:24 door Obelix Idefix
Toevoeging op 09/05/2012 19:44:05:
De hoogte meegeven in de class "witte_tekstregel" heeft geen resultaat.
Gewijzigd op 09/05/2012 19:44:41 door George van Baasbank
margin en padding op 0 zetten?
padding-left: 3px om de onnodige te vervangen en inderdaad <p> hoogte en line-height opgeven.
(en) Paragraph = alinea (nl)
In een <p> (paragraph) element horen dus alleen echte alinea's te staan. Dat is dus vaak niet 1 regeltje tekst. Wat jij hier hebt hoort in een date- (datum), time- (tijdstip), p- (omschrijving), address- (theater) en 2 span elementen (denk ik).
Ook zijn al die div's overbodig. Dat zorgt allemaal bij elkaar voor onnodige ruimte.