Span style werkt niet in IE8 icm HR?
Ik ben bezig met een pagina en wil met Ajax in een div bepaalde informatie laden. Dat gaat prima. Het enige probleem is dat mijn IE8 de pagina vreemd weergeeft. Mijn code is alsvolgt:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
Testen schreef op Donderdag, 13 Augustus 2009
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;">
test<br>
<hr style="height:5px;">
<br>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;">
test<br>
<hr style="height:5px;">
<br>
FireFox geeft het goed weer:
<Eerste de tekst en dan rechts uitgelijnd op dezelfde regel de 4 opties.>
<Daaronder een HR>
<Dan de tekst>
<Dan weer een hr>
IE8 geeft weer:
<Eerst de tekst>
<Daaronder een hr, met op deze regel rechts uitgelijnd de 4 opties>
<Dan de tekst>
<Dan weer een hr>
Iemand enig idee hoe dat komt? Ik heb al van alles met de display opties geprobeerd, maar ik krijg het niet voor elkaar.
Alvast bedankt.
Gewijzigd op 01/01/1970 01:00:00 door Whatever Whatever
Als je naar www.datepunt.nl gaat en daar inlogt als:
username: testen
wachtwoord: testen
Dan naar het tabblad gastenboek. Daar zul je het zien.
Code (php)
1
2
3
2
3
<strong>Testen schreef op Donderdag, 14 Augustus 2009</strong>
<span style="float: right; display: inline;">Verwijderen Wijzigen Prive Goedkeuren</span>
<hr style="display: block;"/>
<span style="float: right; display: inline;">Verwijderen Wijzigen Prive Goedkeuren</span>
<hr style="display: block;"/>
in zoiets:
Code (php)
1
2
3
4
5
2
3
4
5
<p style="overflow: hidden; width: 100%;">
<strong>Testen schreef op Donderdag, 14 Augustus 2009</strong>
<span style="float: right; display: inline;">Verwijderen Wijzigen Prive Goedkeuren</span>
</p>
<hr style="display: block;"/>
<strong>Testen schreef op Donderdag, 14 Augustus 2009</strong>
<span style="float: right; display: inline;">Verwijderen Wijzigen Prive Goedkeuren</span>
</p>
<hr style="display: block;"/>
Nog een tip: gebruik geen inline styles. Zet je styles in een apart CSS bestand en include ze in de header.
Het lijkt al iets beter, het staat nu niet achter de hr. Het enige probleem is dat het ook niet achter het andere deel staat. Het deel voor de hr is nu 2 regels hoog. Met op iedere regel iets. Het is de bedoeling dat die samen op 1 regel komen. Het is dus helaas nog niet opgelost.
Wat betreft de inline styles. Bedankt voor de tip. Ik probeer het ook tot een minimum te beperken. Het enige probleem is dat dit uit een ajax script komt en ik wil ervoor zorgen dat ik daarin de opmaak kan regelen. Dat is veel flexibeler (styles aanpassen aan de hand van..... whatever). Verder merk ik dat als je bijvoorbeeld background in een style sheet zet dat ze via javascript niet aan te passen zijn. Als je ze inline zet dan zijn ze wel aan te passen. Vandaar dus inline styles. Maar toch goed dat je het even aangeeft.
ps: Ik ga even mij server herstarten, dus het kan zijn dat de site even niet bereikbaar is.
Gewijzigd op 01/01/1970 01:00:00 door Whatever Whatever
Ik begin nu echt te denken dat het gewoon een bug in IE8 is....
Code (php)
1
klopte niet...
Ik denk niet dat het een ie8 bug is, want ik heb nooit problemen met floatende stuff
Ik neem aan dat elke bericht op zich ook in een div of een span zit? Je kan misschien ook met breedtes wat doen.
edit: zo werkt het bij mij in ie8, ik heb het net getest. Bovenstaande klopt niet helemaal. je moet het zo doen:
Code (php)
1
klopt ook niet
EDIT @
oeioei, ik ben een beetje slordig geweest. het is vrijdagmiddag denk ik :)
ik was vergeten dat er ook nog iets stond van "blabla schreef dit en dat"
als je dat in een div zet, werkt het (nu echt waar)
dus:
Code (php)
1
2
3
4
5
6
7
2
3
4
5
6
7
<div>pietje schreef op weet ik wanneer:</div>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;">
<span style="clear:both;">test<br></span>
<hr style="height:5px;">
<br>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;">
<span style="clear:both;">test<br></span>
<hr style="height:5px;">
<br>
Gewijzigd op 01/01/1970 01:00:00 door Leen M
/edit: Je had het al opgemerkt.
Helaas tot mijn grote spijt werkt het nog steeds niet. Sla maar op in een .html bestand en open maar in IE8....
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
2
3
4
5
6
7
8
9
10
11
12
<html>
<body>
<div>pietje schreef op weet ik wanneer:</div>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;">
<span style="clear:both;">test<br></span>
<hr style="height:5px;">
<br>
</body>
</html>
[/Code]
<body>
<div>pietje schreef op weet ik wanneer:</div>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;">
<span style="clear:both;">test<br></span>
<hr style="height:5px;">
<br>
</body>
</html>
[/Code]
Gewijzigd op 01/01/1970 01:00:00 door Whatever Whatever
edit: de code van bovenstaande screenshot:
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
<html>
<body>
<div id="gbmessages" style="float:left;position:relative;width:660px;top:15px;margin-left:8px;margin-right:8px;">
<strong>Testen schreef op Donderdag, 14 Augustus 2009</strong>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;">
<span style="clear:both;">test<br></span>
<hr style="height:5px;">
<br>
</div>
</body>
</html>
<body>
<div id="gbmessages" style="float:left;position:relative;width:660px;top:15px;margin-left:8px;margin-right:8px;">
<strong>Testen schreef op Donderdag, 14 Augustus 2009</strong>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;">
<span style="clear:both;">test<br></span>
<hr style="height:5px;">
<br>
</div>
</body>
</html>
Gewijzigd op 01/01/1970 01:00:00 door Leen M
Mozilla doet het wel goed met dezelfde code. Zo moet het er dus uitzien:
Gewijzigd op 01/01/1970 01:00:00 door Whatever Whatever
Code (php)
1
2
3
4
5
6
7
8
9
10
11
12
13
2
3
4
5
6
7
8
9
10
11
12
13
<html>
<body>
<div id="gbmessages" style="float:left;position:relative;width:660px;top:15px;margin-left:8px;margin-right:8px;">
<span style="float:left;"><strong>Testen schreef op Donderdag, 14 Augustus 2009</strong></span>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;clear:both;">
test<br>
<hr style="height:5px;">
<br>
</div>
</body>
</html>
<body>
<div id="gbmessages" style="float:left;position:relative;width:660px;top:15px;margin-left:8px;margin-right:8px;">
<span style="float:left;"><strong>Testen schreef op Donderdag, 14 Augustus 2009</strong></span>
<span style="float:right;display:inline;">Verwijderen Wijzigen
Prive Goedkeuren</span>
<hr style="display:block;clear:both;">
test<br>
<hr style="height:5px;">
<br>
</div>
</body>
</html>
Bedankt Leen, je hebt mij weer blij gemaakt!