28173 sujets

CSS et mise en forme, CSS3

Bonsoir à tous,

Je n'arrive pas à régler un pépin CSS. J'aimerais, que dans le code suivant, le lien du <span> soit placé complètement à droite et que le texte LOREM IPSUM soit placé à gauche :


<h2>LOREM IPSUM<span>&nbsp;<a href="#" title="Hello">Hello</a>&nbsp;</span></h2>


Comment dois-je procéder en CSS svp ?

Merci de votre aide !

Webdeb73.
Modifié par webdeb73 (29 Sep 2006 - 23:12)
Bonjour,

Regarde si ça te va ou alors je n'ai pas compris

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

  <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" >

<head>

<title>test ghost</title>

	<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1" />

<style type="text/css">

#conteneur{
padding: 10px;
width: 400px;
border: 1px solid #000;
background: #627dfe;
overflow: hidden;
margin: auto;
font-size: 0.9em;
}


#conteneur h2{
margin:0;
float: left;
font-size: 0.9em;
background: #627dfe;
width: 192px;
margin-left: 5px;
line-height: 16px;
}

#conteneur a{
display: block;
float: left;
background: #fff;
width: 192px;
margin-right: 5px;
text-align: center;
text-decoration: none;
margin:0;
line-height: 16px;
}

</style>
</head>
<body>
<div id="conteneur">
<h2>LOREM IPSUM</h2>
<a href="#" title="Hello">Hello</a>  
</div>
</body>
</html>
Salut,

. Tu rends ton lorem ipsum utilisable en le mettant dans un span.

. Tu identifies les deux span utilisés, #lorem et #lien.

Soit :

html

<h2><span id="lorem">LOREM IPSUM</span><span id="lien"> <a href="#" title="Hello">Hello</a> </span></h2>


puis css

#lorem {
float:left;
}
#lien {
display:block;
text-align:right;
}


Et voilà Smiley cligne