28172 sujets

CSS et mise en forme, CSS3

Bonjour

petit problème
dans un <div> qui représente une ligne j'ai plusieurs informations dont deux zones qui varient en longueur en fonction du contenu. celui-ci change régulièrement ce qui fait que la suite de la ligne change constamment de position.
je voudrais bloquer le tout

un code exemple :

<html><body>
	<div id="ligne1" style="overflow:hidden;white-space:nowrap;text-overflow:ellipsis;">
		<a href="#" onclick="">[AAA]</a>&nbsp;
		<a href="#" onclick="">Rappel auto [N]</a> &diams;
			&nbsp;id=1 &diams;&nbsp;22/11/13 &diams;
		<span style="padding:0 .2em;border:medium double blue;white-space: nowrap;">xxx</span>
		<span id='points'>1/1</span>&nbsp;&diams;
		<span id='clock'>0</span>
		<span style="padding:0 .2em;border:medium double blue;white-space: nowrap;">yyyyyyyy</span>
		<span id='info'>zz zzz</span>
		<br>
	</div>
</body></html>


il s'agit du span 'points' qui peut varier de 1/1 à 999/999
et du span suivant 'clock' qui peut varier de 0 à 60

peut-on leur donner une largeur fixe à l'intérieur de la ligne les infos précédentes étant fixes par construction, la suivante 'infos' étant variable mais limitée à la largeur disponible dans la ligne.

Second petite question si ce n'est trop demander Smiley confus
j'ai deux petites zones encadrées :
sous IE 6 l'encadrement est complet (double partout)
sous Firefox simple en haut et rien en bas
sous K-Meleon simple en bas et rien en haut
c'est simple non ? Smiley biggrin
si pas de solution je voudrais remplacer par un fond coloré ...

Merci pour toute indication (surtout pour la question 1)
Modifié par papami (27 Nov 2013 - 11:35)