CSS probleem
Nu laat ik in een loop wat gegevens, afbeeldingen, en documenten plaatsen.
Er is een stukje tekst dat ineens een link is geworden.
Ben al een poosje bezig geweest.
Maar krijg het niet meer goed.
Wanneer ik het bovenste stuk (in PHP) weghaal, is het weer gewone tekst volgens de CSS.
De tekst gaat over de $naam en de $functie1, $functie2.
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<li rel="colorbox">
<?php
$a = $image['thumb_path'];
$b = $image['file_title'];
if($tekoop == "")
{
echo '<img src="'. $a.'" alt ="'. $b. '" title = "geen document">';
} else {
echo '<a href ="'.$tekoop.'" class="embed-link"><img src="'.$a.'" rel="colorbox" alt="Aanbod van '.$naam.'"</a>';
}
?>
<div class = "special" style = "text-align: center;">
<?php echo $naam ?><br>
<?php echo $functie1.' / '.$functie2 ?>
<br>
.
.
.
.
</div>
<?php
$a = $image['thumb_path'];
$b = $image['file_title'];
if($tekoop == "")
{
echo '<img src="'. $a.'" alt ="'. $b. '" title = "geen document">';
} else {
echo '<a href ="'.$tekoop.'" class="embed-link"><img src="'.$a.'" rel="colorbox" alt="Aanbod van '.$naam.'"</a>';
}
?>
<div class = "special" style = "text-align: center;">
<?php echo $naam ?><br>
<?php echo $functie1.' / '.$functie2 ?>
<br>
.
.
.
.
</div>
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
#special {
position: relative;
width: 158px;
height: 75px;
color: #fffff;
margin-top: 5px;
display: in-block;
cursor: hand;
text-align: center;
padding: 2px, 2px, 2px, 2px;
padding-top: 4px;
overflow-x: hidden;
overflow-y: hidden;
border-top: 1px solid #233d47;
border-left: 1px solid #233d47;
border-right: 1px solid #204656;
border-bottom: 1px solid #204656;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
position: relative;
width: 158px;
height: 75px;
color: #fffff;
margin-top: 5px;
display: in-block;
cursor: hand;
text-align: center;
padding: 2px, 2px, 2px, 2px;
padding-top: 4px;
overflow-x: hidden;
overflow-y: hidden;
border-top: 1px solid #233d47;
border-left: 1px solid #233d47;
border-right: 1px solid #204656;
border-bottom: 1px solid #204656;
-moz-border-radius: 5px;
-webkit-border-radius: 5px;
border-radius: 5px;
}
Gewijzigd op 08/01/2018 10:31:18 door - Ariën -
Je kunt overigens in en uit een PHP blok springen, dat zou e.e.a. stukken leesbaarder kunnen maken.
Vergelijk:
Code (php)
En voor de goede orde zou je over $a, $b, $tekoop en $naam htmlspecialchars() moeten gooien, om enige betekenis die deze waarden mogelijk hebben binnen HTML te neutraliseren (onder het mom "escape output").
Gewijzigd op 07/01/2018 01:13:17 door Thomas van den Heuvel
Dat was inderdaad de oplossing.
Beetje te lang op lopen turen denk ik, haha.
De $a en $b zijn daar even onder die naam neergezet om te testen.
Krijgen een meer functionele naam.
Maar bedankt voor de tips.
Het helpt altijd om je HTML-code door de W3-validator te halen als je merkt dat er vreemde dingen gebeuren m.b.t. je opmaak.
bijvoorbeeld: <div class = "special" style = "text-align: center;">
ik heb het niet getest, maar kan me voorstellen dat in elk geval sommige browsers zouden kunnen vinden dat class en style nu leeg zijn en dat er nog wat onbegrepen properties zijn "speciaal" en "text...;"
Hetzelfde geldt voor je img en a tags.