28173 sujets

CSS et mise en forme, CSS3

Bonjour à tous,

J'ai un petit soucis avec un élément <h3> , j'essaye de positionner cet élément à la droite d'un texte mais celui ce comporte comme un élement en bloc et le texte passe donc en dessous.

Je vous envoie le lien du site que je suis entrain de faire pour que vous vous rendez compte du problème , merci d'avance !

http://lmdi.be/index.php
je sais pas ce que tu cherches a faire mais pour aligner un element bloc avec un autre element c'est le flottant et pour que le texte n'apparraisse pas utilise span et span display:none
Rajoute des span associés à display: none; autour du texte du lien :
BALISAGE :

<div id="footer">
     <div id="copyright">
     <h3>
          <a href="http://www.paintoo.info" title="PaintoO">[#orange]<span>[/#]PaintoO[#orange]</span>[/#]</a>
     </h3>
     Copyright ©  LMDI 2006 Tous droits réservés 
     </div>
</div>

CSS :

[#orange]div#copyright h3 a span {display:none;}[/#]
Le span display:none ne fonctionne pas ... et le positionnement flottant , j'ai testé aussi et le résultat est que mon élément <h3> n'apparait plus ...
CSS :
img {border: none;}


BALISAGE :
<div id="copyright">
	<a href="#"><img src="logotype.gif" alt="PaintoO" /></a>
	Copyright ©  LMDI 2006 Tous droits réservés
</div>


Vu que c'est un logo, on peut placer l'image dans le balisage où elle a sa place (ce qui permet de la conserver même sans feuille de style).

(Je viens de supprimer tout ce qui ne servait pas.)
Modifié par Smiley neko (25 May 2006 - 12:51)

div#copyright h3
{
	float: left
	background:transparent url(images/logo_paintoo.gif) no-repeat;
	margin: 0 0 0 400px;
	padding: 0;
}
div#copyright h3 span
{
	display:none
}
Finalement, le texte en display: none; ne sert que si on désactive la feuille de style.

Feuille de style activée : l'image transmet l'information aux personnes voyantes, les autres ne bénéficient pas du texte caché par span.

Images désactivées : plus d'information
Merci neko pour cette information !

Jp94 , peux tu m'expliquer l'intérêt d'utiliser une marge négative pour ce cas de figure ... et je te remercie encore pour avoir passer du temps sur mon soucis !!
j'ai utilisé une marge negative parceque toi tu avais mis une marge de 520px donc fallait compenser si tu retournes sur la page tu verras j'ai supprimé ta marge et je n'ai plus de marge negative sur h3 mais positive.
pour aligner le texte a droite je n'ai pas mis de margin-left mais un simple text-align: right;