18042 sujets

Questions générales et questions de débutants

Affichage d'une div cadre bords arrondis

Bonjour,

Je commence l'intégration des paramétrages concernant l'accessibilite!
l'affichage dans une page ou il y a que mon body et le paramétrage de mon cadre à bouts arrondis s'affiche correctement

Seulement, dans ma feuille où il y a le -conteneur, contenu, global etc...
l'affichage se fait qu'a moitié. c'est à dire que j'affiche un rectangle à gauche et un rectangle à bouts arrondis à droite!


mon code css est le suivant :

#cadre { /* taille du cadre, à titre d'exemple width: 10em;*/

FONT-SIZE: 85%; 
background-color: #909090;
}
/* propriétés communes à l'ensemble des 4 coins */
#hautgauche, #hautdroit, #basgauche, #basdroit {
height: 19px; width: 19px;
background-repeat: no-repeat;
/* correction d'un bug IE */
}
/* propriétés spécifiques à chaque coin */
#hautgauche {
background: url(../images/hautgauche.gif);
}
#hautdroit {
float: right;
background: url(../images/hautdroit.gif);
}
#basgauche {
background: url(../images/basgauche.gif);
}
#basdroit {
float: right;
background: url(../images/basdroit.gif);
}

et le code HTLM :
<body>
<div id="conteneur"> 
<div id="global"> 
<div id="cadre">
<div id="hautdroit"></div><div id="hautgauche"></div>

<a href="http://www.education.gouv.fr"><img src="images/titre1.gif" alt="logo du ministere" 
title="lien vers page accueil du minist&egrave;re de l'éducation nationale" /></a> 


<p class="presentation">Apr&egrave;s avoir saisi votre n&deg; de d&eacute;partement 
et votre code confidentiel, vous pourrez obtenir la liste des agents qui 
ont mut&eacute; ou permut&eacute; depuis ou vers votre d&eacute;partement, 
ainsi que ceux qui n'ont pas eu satisfaction.</p>
<p class="annee">- année 2006 -</p>
<form name="form1" method="post" action="">
<table class="ident" summary="identification" >
<caption class="tabtitleIdent">
Veuillez saisir vos codes d&eacute;partement et confidentiel<br>
</caption>
<tr> 
<td class="saisieIdent"> Code d&eacute;partement</td>
<td class="saisieIdent"> <input name="codDep" type="text" id="codDep" value=""></td>
</tr>
<tr>
<td >&nbsp;</td>
<td >&nbsp;</td>
</tr>
<tr> 
<td class="saisieIdent"> Code confidentiel</td>
<td class="saisieIdent"> <input name="codConf" type="text" id="codConf" value=""> </td>

</tr>
</table>
<p>
<input class="bouton:active" type="submit" name="Submit" value="Envoyer">
</p>
</form>
<p>&nbsp;</p>





<div id="basdroit"></div><div id="basgauche"></div>
</div> </div>
</div>


Si des personnes peuvent d'aider, Je vous remercie.

77s
Salut,

je suis peut être à côté de la plque, mais j'ai suivi ce tuto pour mon site ...

cadre avec arrondi
Smiley ohwell

Et je pense que la réponse aux questions s'y trouve Smiley cligne

Au passage si il est possible de mettre un lien vers la page en cause permettrais de mieux se rendre compte.
Modifié par mac97000 (05 Dec 2006 - 15:23)
Salut,

je vois que tu as 7 div dans ton document, pour ce que tu cherches à obtenir ça fait 5 de trop.

Par contre tu n'as pas de titre de section et là ça manque.

Ceci suffirait concernant les div

<body>
<div id="global"> 
<p>
<a href="http://www.education.gouv.fr"><img src="images/titre1.gif" alt="logo du ministere" 

title="lien vers page accueil du minist&egrave;re de l'éducation nationale" /></a> 
</p>
<div id="contenu">
<p class="presentation">Apr&egrave;s avoir saisi votre n&deg; de ...

... etc ...


<p>Contenu de fin de document</p>
</div>
</div>
</body>


Pour utiliser ça afin d'avoir 4 coins tu peux regarder le petit topo que j'ai fait ici :
http://clb56.fr/test_css/test_roundcorner/

Il y a trois pages, les deux premières concernent directement les coins arrondis simples (sans bordures).
Modifié par clb56 (05 Dec 2006 - 18:51)
Sujet clos
Aller à