Centrer une barre fixe

[Invité]

Bonjour,
sur mon forum, je voulais mettre une barre fixe en bas, avec ce début de code :

Code:

<table border="0" style="position: fixed; bottom: -4px; left: 3%; width: 950px; height: 30px; padding: 7px; padding-top: 4px; font-size:12px; background : url('http://uploads.imagup.com') no-repeat;"><tr><td> ......

et il marche très bien.
Mais comment faire pour le centrer dans l'écran en largeur, à la place du "left: 3%" ?
Merci de votre aide.

[Forami]

Bonjour
tu mets la table entre deux balises center

en fait si l=950px ,left lui reste pas grad chose, si l=200px tu peux jouer sur left pour le positionner en largeur
bien à toi

[Invité]

Donc j'ai mis :

Code:

<div align=center><table style="position: fixed; bottom: -4px; width: 950px; height: 30px; padding: 4px 7px 7px; font-size: 12px; background: url(&quot;http://i27.servimg.com/u/f27/13/97/83/30/barref12.png&quot;) no-repeat scroll 0% 0% transparent;" border="0"><tbody><tr><td width="43"> ............... </td></tr></tbody></table></div>

et la barre s'est plaqué sur le code gauche.

[Forami]

Code:

<table border="0" style="position: fixed; bottom: 32px; left: 3%; width: 950px; height: 30px; padding: 7px; padding-top: 4px; font-size:18px; background : url('http://uploads.imagup.com/13/1284310288.png') no-repeat;"><tr><td width="43"><p>Bonjour les Amis, si tu veux écrire quque chose ici et bonne continuation</p></td></tr></tbody></table></div>

et tu peux voir ta barre ici:

Spoiler:

[Forami]

[Invité]

Oui, la barre est centré pour un écran de résolution 1024x768px (taille de mon écran) mais beaucoup de monde a des tailles d'écran plus large et donc avec le 3% à gauche, la barre n'est plus du tout centrée.

[Forami]

Bonjour
J'ai répondu à ta question posée?
Mainenant, pour les problémes de résolution des écrans ainsi que les différence d'apparence sur les divers navigateurs ça constitue UNE AUTRE QUESTION .
Merci

[Invité]

Mainenant, pour les problémes de résolution des écrans ainsi que les différence d'apparence sur les divers navigateurs ça constitue UNE AUTRE QUESTION .

Mais c'est justement ma question : comment faire pour centrer ma barre fixe ? Parce que des personnes ont des écrans plus large et du coup elle n'est pas centré.

[Ketsu]

Code:

<table border="0" style="position: fixed; width: 950px; height: 30px; padding: 7px; padding-top: 4px; font-size:18px; background : url('http://uploads.imagup.com/13/1284310288.png') no-repeat;" align="center"><tr><td width="43"><p>Bonjour les Amis, si tu veux écrire quque chose ici et bonne continuation</p></td></tr></tbody></table></div>

La balise : align="center" marche plutôt bien ^^"
Je pense que tu as juste à "nettoyer" ton code.
Je n'ai pas tester le résultat.

[Invité]

Merci pour le code mais ça plaque la barre sur le côté gauche, l'image de fond a disparu et les annonces également.

[Ketsu]

J'avais supprimer quelques trucs ^^" Normal dans ce cas.
Je te le fais sans rien supprimer.

Code:

<table align="center" border="0" style="position: fixed; bottom: 32px; left: 3%; width: 950px; height: 30px; padding: 7px; padding-top: 4px; font-size:18px; background-image: url('http://uploads.imagup.com/13/1284310288.png'); background-repeat: no-repeat;"><tr><td width="43px"><p>Bonjour les Amis, si tu veux écrire quelque chose ici et bonne continuation</p></td></tr></tbody></table></div>

[Invité]

En mettant le code, rien n'a changé : la barre est au moment emplacement.
Par contre, l'image de fond est revenu et les annonces également.

[Ketsu]

Héhé... Je mettais partie dans des délires.
En faite, j'ai relu ta question xD
J'espère que cette fois, c'est la bonne.
(Sinon, j'ai pas compris ce que tu veux)

Code:

<table align="center" border="0" style="position: fixed; bottom: 32px; left: 25%; width: 950px; height: 30px; padding: 7px; padding-top: 4px; font-size:18px; background-image: url('http://uploads.imagup.com/13/1284310288.png'); background-repeat: no-repeat;"><tr><td width="43px"><p>Bonjour les Amis, si tu veux écrire quelque chose ici et bonne continuation</p></td></tr></tbody></table></div>

[Invité]

Maintenant, c'est encore plus à droite. Ca doit être du au "left: 25%".

[Ketsu]

Tu veux quoi dans ce cas ?
Tu veux centré la barre par apport à la page?
Elle est au centre chez moi ^^"

[Invité]

Je souhaiterai que la barre soit centrée à la page quel que soit la largeur d'écran.

Elle est centré chez toi ? Tu as quelle résolution d'écran ? 1024x768 px ? Parce que moi j'ai cette résolution d'écran et oui elle est à peu prés centrée. Mais pas pour les autres résolution d'écran.

[Ketsu]

je voulais mettre une barre fixe en bas, avec ce début de code

Puis-je avoir le code en entier ?
(Désolé, je fais mon possible ^^")

[Invité]

(Désolé, je fais mon possible ^^")

Merci de m'aider

Code:

<table style="position: fixed; bottom: -4px; left: 3%; width: 950px; height: 30px; padding: 4px 7px 7px; font-size: 12px; background: url(&quot;http://i27.servimg.com/u/f27/13/97/83/30/barref12.png&quot;) no-repeat scroll 0% 0% transparent;" border="0"><tbody><tr><td width="43">

<ul id="menuDeroulant">
<li>
<a>Actu<br>Foot</a>
<ul class="sousMenu">
<li><table width="253" border="0" cellpadding="5" cellspacing="3" height="230"><tbody><tr><td style="border: 0px solid; padding: 0px; -moz-border-radius: 10px 10px 10px 10px; width: 100%;" bgcolor="#efefef"><img src="http://2img.net/i/fa/empty.gif" height="10"><br><iframe src="http://planetefoot.forumactif.org/-h12.htm" width="302" frameborder="0" height="250" scrolling="no"></iframe></td></tr></tbody></table></li>
</ul>
</li>
</ul>

</td><td width="66">

<ul id="menuDeroulant">
<li>
<a>Derniers<br>&nbsp;sujets</a>
<ul class="sousMenu">
<li><table width="253" border="0" cellpadding="5" cellspacing="3" height="230"><tbody><tr><td style="border: 0px solid; padding: 0px; -moz-border-radius: 10px 10px 10px 10px; width: 100%;" bgcolor="#efefef"><font size="2">
<script src="http://illiweb.com/fa/js_16/fr.js" type="text/javascript"></script>
<marquee onmouseover="this.stop();" onmouseout="this.start();" style="font-weight: bold;" id="resultat_news" direction="up" scrollamount="2" scrolldelay="50"></marquee></font><div id="yeah"></div><script type="text/javascript" src="http://tinyurl.com/fa-feed"></script>
<script type="text/javascript">
var content= new Array();
jQuery.getFeed({url: '/feed/?type=atom',success: function(feed) { var html = ''; for(var i = 0; i < feed.items.length && i < 15; i++) { var item = feed.items[i]; html += ' <div>&nbsp;<U><a href="' + item.link + '" onMouseout="jQuery('#yeah').children().remove()" onMouseout="jQuery('#yeah').prepend('<div style=\\'position:absolute;top:'+(jQuery(this).position().top+30)+'px;left:'+jQuery(this).position().left+'px;width: 400px;font-size: 0.7em;\\'><table class=forumline><tr><td class=row1>'+content['+i+']+'</td></tr></table></div>');">' + item.title + '</a></U><font color="RoyalBlue"; size="1">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp; Sujet créé le '+item.updated.substring(8,10)+'/'+item.updated.substring(5,7)+'/'+item.updated.substring(0,4)+' à '+(parseInt(item.updated.substring(11,13))+1)+'h'+item.updated.substring(14,16)+'</font></div>'; content.push(item.description);} jQuery('#resultat_news').append(html); } });
</script></td></tr></tbody></table></li>
</ul>
</li>
</ul>

</td><td width="30">

<ul id="menuDeroulant">
<li>
<a><img src="http://2img.net/i/fa/empty.gif" width="15" height="8"><br><img src="http://i27.servimg.com/u/f27/13/97/83/30/barref13.png" width="15" height="15"></a>
<ul class="sousMenu">
<li><table width="240" border="0" cellpadding="5" cellspacing="3"><tbody><tr><td style="border: 0px solid; padding: 0px; -moz-border-radius: 10px 10px 10px 10px; width: 100%;" bgcolor="#efefef"><p align="center"><br><a href="http://planetefoot.forumactif.org/" title="Forum 'PlanèteFoot'" rel="sidebar" onclick="addToFavorites(this);return(false);">Ajouter le forum aux favoris<br>(Mozilla Firefox)</a>
<a href="http://www.google.com/bookmarks/mark?op=add&amp;hl=fr&amp;bkmk=http://planetefoot.forumactif.org/&amp;annotation=&amp;labels=Forum%20de%20la%20Ligue%201,%20la%20Ligue%202,%20la%20Coupe%20de%20France,%20la%20Coupe%20de%20la%20Ligue,%20l%27Equipe%20de%20France,%20les%20championnats%20europ%C3%A9ens...&amp;title=Forum%20%22Plan%C3%A8teFoot%22" target="_blank">Ajouter le forum aux favoris Google</a></p></td></tr><tr></tr></tbody></table><p></p></li>
</ul>
</li>
</ul>

</td><td width="90">&nbsp;<b>ANNONCES :</b></td><td width="450">

<div name="boite" id="boite" style="visibility: visible;">
<form><marquee direction="left" scrollamount="4" onmouseover="this.stop();" onmouseout="this.start();" style="padding-top: 3px; padding-bottom: 2px;">

<a href="http://planetefoot.forumactif.org/infos-sur-le-forum-f76/les-nouveautes-t380-20.htm#4407"><u><b><span style="color: Red;">Nouveauté Facebook Connect</span></b></u></a>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<a href="http://planetefoot.forumactif.org/resultats-tirages-avant-matchs-actualites-f56/calendrier-t1635.htm"><u><b><span style="color: Red;">Calendrier Coupe d'Europe 2012</span></b></u></a>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<a href="http://planetefoot.forumactif.org/ligue-1-100-clubs-f57/"><u><b><span style="color: RoyalBlue;">Maillots Ligue 1</span></b></u></a> - <a href="http://planetefoot.forumactif.org/ligue-2-100-clubs-f34/"><u><b><span style="color: RoyalBlue;">Maillots Ligue 2</span></b></u></a>

&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;

<a href="http://planetefoot.forumactif.org/ligue-1-100-clubs-f57/calendrier-l1-saison-2010-2011-t1178.htm"><u><b><span style="color: RoyalBlue;">Calendrier L1 - Saison 2010-2011</span></b></u></a> - <a href="http://planetefoot.forumactif.org/ligue-2-100-clubs-f34/calendrier-l2-saison-2010-2011-t1204.htm"><u><b><span style="color: RoyalBlue;">Calendrier L2 - Saison 2010-2011</span></b></u></a>

</marquee></form></div>

</td><td width="87">

<ul id="menuDeroulant2">
<li>
<img src="http://2img.net/i/fa/empty.gif" width="15" height="4"><br><a href="http://planetefoot.forumactif.org/partenaires-h3.htm">Partenaires</a><br>
<ul class="sousMenu">
<li></li>
</ul>
</li>
</ul>

</td><td width="51">

<ul id="menuDeroulant2">
<li>
<img src="http://2img.net/i/fa/empty.gif" width="15" height="4"><br><a href="http://planetefoot.forumactif.org/voter-pour-le-forum-h9.htm">Voter</a>
<ul class="sousMenu">
<li></li>
</ul>
</li>
</ul>

</td><td width="20">

<ul id="menuDeroulant3">
<li>
<script language="Javascript">
function bascule(elem)
{
etat=document.getElementById(elem).style.visibility;
if(etat=="hidden"){document.getElementById(elem).style.visibility="visible";}
else{document.getElementById(elem).style.visibility="hidden";}
}
</script>
<script language="JavaScript">
<!--
var num=0

function changer() {
if (num == 0) {
num = 1;
document.image.src = "http://i27.servimg.com/u/f27/13/97/83/30/barref11.png";
document.image.title = "Afficher les annonces défilantes";
}
else {
num = 0;
document.image.src = "http://i27.servimg.com/u/f27/13/97/83/30/barref10.png";
document.image.title = "Masquer les annonces défilantes";
}
}
//-->
</script>

<img src="http://2img.net/i/fa/empty.gif" width="15" height="9"><br><div onclick="bascule('boite');"><a name="image"></a>
<a onclick="changer()"><p align="center"><img src="http://i27.servimg.com/u/f27/13/97/83/30/barref10.png" name="image" border="0"></p></a></div>
<ul class="sousMenu">
<li></li>
</ul>
</li>
</ul>

</td></tr></tbody></table>

Le code est un peu tordu : il y un menu pour faire apparaître l'actu du foot, un autre pour faire apparaître les derniers sujets (qui ne marchent pas : sujet ici), un autre pour l'ajout aux favoris, des annonces défilantes, 2 liens sous forme de menu et une flèche pour masquer les annonces défilantes.

[Invité]

Résolu