Positionnement lien/boutons dans une table
barjoray
-
glabok Messages postés 139 Statut Membre -
glabok Messages postés 139 Statut Membre -
Bonjour,
Je rencontre quelque problemes pour positionner des boutons a l'interieur d'une table.
Je dois en fait les centrer sur la ligne mais malgre la propriete align=center, ils s'obstinent a rester a gauche.. :(
Voici une partie du html
<table border="1" width="450" cellspacing="0" cellpadding="0">
<tr>
<td colspan="4" align="center">
<a href="javascript:createNewProject();" class="custombtn">
<span style="width:68px;">
New ...
</span>
</a>
<a href="javascript:doAction('delete');" class="custombtn">
<span style="width:68px;">
Delete
</span>
</a>
</td>
</tr>
</tab>
et du css
a.custombtn {
cursor:pointer;
display:block;
float:left;
font:bold 0.917em Helvetica, Arial, sans-serif;
height:22px;
margin-right:3px;
padding:0 5px 0 0;
text-align:center;
text-decoration: none;
}
a.custombtn span {
color:#333;
display: block;
height:22px;
line-height:23px;
padding:0 1px 0 6px;
text-decoration:none;
white-space:nowrap;
}
a.custombtn { background:url(../images/j_button2_right_cap.png) no-repeat top right; }
a.custombtn span { background:url(../images/j_button2_left.png) no-repeat top left; }
J'ai deja pas mal fouiller dans les tuto css pour rajouter des display et de float.. mais en vain (j'y connais vraiment pas grand chose)
Merci d'avance pour votre aide! :)
Je rencontre quelque problemes pour positionner des boutons a l'interieur d'une table.
Je dois en fait les centrer sur la ligne mais malgre la propriete align=center, ils s'obstinent a rester a gauche.. :(
Voici une partie du html
<table border="1" width="450" cellspacing="0" cellpadding="0">
<tr>
<td colspan="4" align="center">
<a href="javascript:createNewProject();" class="custombtn">
<span style="width:68px;">
New ...
</span>
</a>
<a href="javascript:doAction('delete');" class="custombtn">
<span style="width:68px;">
Delete
</span>
</a>
</td>
</tr>
</tab>
et du css
a.custombtn {
cursor:pointer;
display:block;
float:left;
font:bold 0.917em Helvetica, Arial, sans-serif;
height:22px;
margin-right:3px;
padding:0 5px 0 0;
text-align:center;
text-decoration: none;
}
a.custombtn span {
color:#333;
display: block;
height:22px;
line-height:23px;
padding:0 1px 0 6px;
text-decoration:none;
white-space:nowrap;
}
a.custombtn { background:url(../images/j_button2_right_cap.png) no-repeat top right; }
a.custombtn span { background:url(../images/j_button2_left.png) no-repeat top left; }
J'ai deja pas mal fouiller dans les tuto css pour rajouter des display et de float.. mais en vain (j'y connais vraiment pas grand chose)
Merci d'avance pour votre aide! :)
A voir également:
- Positionnement lien/boutons dans une table
- Lien url - Guide
- Table ascii - Guide
- Créer un lien pour partager des photos - Guide
- Table des matières word - Guide
- Table des annexes word ✓ - Forum Word
3 réponses
Essaye ca : (j'ai faut au plus simple, pas sur à 100% que ça marche, mais sinon il existe d'autre solutions)
<table border="1" width="450" cellspacing="0" cellpadding="0">
<tr>
<td colspan="4" align="center">
<p style="text-align:center;">
<a href="javascript:createNewProject();" class="custombtn">
<span style="width:68px;">
New ...
</span>
</a>
<a href="javascript:doAction('delete');" class="custombtn">
<span style="width:68px;">
Delete
</span>
</a>
</p>
</td>
</tr>
</tab>
Ca na marche pas... En fait javais plus ou moins deja essaiye en mettant <td align=center> et en rajoutant la balise <p> qui encadre mes boutons mais en vain..
C'est quoi les autres solutions?
Merci!
C'est quoi les autres solutions?
Merci!
En enlevant deux trois trucs dans le css (les float et des display) cela marche, même sans le <p> que j'avais rajouté initialement (peut être qu'il sera quand même à rajouter suivant ton intégration)
<style>
a.custombtn {
cursor:pointer;
font:bold 0.917em Helvetica, Arial, sans-serif;
height:22px;
margin-right:3px;
padding:0 5px 0 0;
text-align:center;
text-decoration: none;
}
a.custombtn span {
color:#333;
height:22px;
line-height:23px;
padding:0 1px 0 6px;
text-decoration:none;
white-space:nowrap;
}
</style>
<table border="1" width="450" cellspacing="0" cellpadding="0">
<tr>
<td colspan="4" align="center">
<a href="javascript:createNewProject();" class="custombtn">
<span style="width:68px;">
New ...
</span>
</a>
<a href="javascript:doAction('delete');" class="custombtn">
<span style="width:68px;">
Delete
</span>
</a>
</td>
</tr>
</tab>
