PB CSS/HTML fonction onmouseover/onmouseout

cocomel - 4 janv. 2010 à 13:15
Atropa Messages postés 1940 Date d'inscription mercredi 25 juin 2008 Statut Membre Dernière intervention 11 mai 2014 - 5 janv. 2010 à 12:44

Bonjour,
je débute dans la création de site web et je me retrouve face à un petit problème de décalage d'image lors de l'ajout de fonction onmouveover/onmouveout.
un petit trait apparait entre mes boutons de sous-menus (utilisés en .jpg),créant un décalage, alors que je n'ai aucun padding, ni bordure.
je pense qu'il s'agit d'un problème de pré-formatage htlm ou css.
quelqu'un pour m'aider?

je vous joint les codes :
---------------------------------------------------------------------------------------------------------------------------
[b]HTML[/b]

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>index</title>
<link href="index.css" rel="stylesheet" type="text/css" />
<style type="text/css">

</style>
</head>

<body>

<div id="bannière">
<div class="version">
<div align="right" class="Style3"> <u>Version française</u> / <u>English version</u></div>
</div>
</div>

<div id="menu_top">

<script type="text/javascript">
function afficheimage (adr_img,url_img,larg,haut)
{
document.images [adr_img].src = url_img;
document.images [adr_img].width = larg;
document.images [adr_img].height = haut;
}
</script>

<a href=""
onmouseover="afficheimage('0','images/intro/bt_accueil_neg.jpg','228','28')"
onmouseout="afficheimage('0','images/intro/bt_accueil.jpg','228','28')"/>
<img src="images/intro/bt_accueil.jpg" alt="indisponible" width="228" height="28" border="0"/>
</a>
<a href=""
onmouseover="afficheimage('1','images/intro/bt_intro_neg.jpg','125','28')"
onmouseout="afficheimage('1','images/intro/bt_intro.jpg','125','28')"/>
<img src="images/intro/bt_intro.jpg" alt="indisponible" width="125" height="28" border="0"/>
</a>
<a href=""
onmouseover="afficheimage('2','images/intro/bt_projets_neg.jpg','124','28')"
onmouseout="afficheimage('2','images/intro/bt_projets.jpg','124','28')"/>
<img src="images/intro/bt_projets.jpg" alt="indisponible" width="124" height="28" border="0"/>
</a>
<a href=""
onmouseover="afficheimage('3','images/intro/bt_portfolio_neg.jpg','123','28')"
onmouseout="afficheimage('3','images/intro/bt_portfolio.jpg','123','28')"/>
<img src="images/intro/bt_portfolio.jpg" alt="indisponible" width="123" height="28" border="0"/>
</a>
<a href=""
onmouseover="afficheimage('4','images/intro/bt_contact_neg.jpg','177','28')"
onmouseout="afficheimage('4','images/intro/bt_contact.jpg','177','28')"/>
<img src="images/intro/bt_contact.jpg" alt="indisponible" width="177" height="28" border="0"/>
</a></div>

<div id="corps">
<div class="texte">
<div align="left"></div>
</div>
</div>

<div id="bas">
<div class="droits">
<div align="right" class="Style3">
<div align="center">Tous Droits Réservés - Reproduction Inderdite - 2009 - Copyright ***.fr</div>
</div>
</div>
</div>
</body>

</html>
-------------------------------------------------------------------------------------------------------------------------------------------------------
[b]CSS[/b]

body{
margin-top:0px;
margin-bottom:0px;
}

#bannière
{
background:url(images/banniere.jpg);
width:800px;
height:164px;
background-position:top;
background-position:center;
background-repeat:no-repeat;
margin:auto;
}
.version
{
padding-right:40px;
padding-top:5px;

}

#menu_top
{
width:810px;
height:28px;
margin:auto;
padding:0px;
}

#corps
{
background:url(images/fond.jpg);
width:608px;
height:353px;
background-position:center;
background-repeat:no-repeat;
background-attachment:scroll;
background-attachment:fixed;
margin:auto;
margin-top:25px;
}
.texte
{
width:558px;
height:353px;
padding-top:15px;
padding-bottom:15px;
padding-right:35px;
padding-left:20px;
text-align:justify;
}

.barre
{
width:30px;
height:353px;
overflow:scroll;
}

#bas
{
background:url(images/bas.jpg);
width:800px;
height:34px;
background-position:bottom;
background-position:center;
background-attachment:fixed;
margin:auto;
margin-top:25px;
}
.droits
{
padding-top:10px;
}
----------------------------------------------------------------------------------------------------------------------------------------------
merci d'avance et à bientôt

Afficher la suite

A voir également:

PB CSS/HTML fonction onmouseover/onmouseout
Fonction si et - Guide
Editeur html - Télécharger - HTML
Fonction miroir - Guide
Fonction moyenne excel - Guide
Excel remplir automatiquement une cellule en fonction d'une autre ✓ - Forum Excel

1 réponse

Réponse 1 / 1

Atropa Messages postés 1940 Date d'inscription mercredi 25 juin 2008 Statut Membre Dernière intervention 11 mai 2014 274
5 janv. 2010 à 12:44

bonjour,

oubli ie 6 déjà... et ie tout cour si tu peux te le permettre

utilises firefox safari chrome ou opera

ie c'est de la merde regarde sur la page wikipédia les résultat à l'acid 3 test

https://fr.wikipedia.org/wiki/Acid3

personnellement j'ai moins opéra parce qu'il n'y a aucun moyen de le faire gérer border-radius pour l'instant

mon préféré étant firefox surtout pour certain add-on comme :

ad-block : qui bloque toutes les publicité

html validator : qui affiche directement le nombre d'erreur dans la page et fais gagner beaucoup de temps pour la validation w3c

firebug : qui permet de débugger le javascript entre autre

web developer : qui devient vite indispensable également

utiliser un de ces navigateurs est déjà plus pratique, rapide et sur que d'utiliser ie

mais surtout pour celui qui fait un site, ca permet de ne faire qu'un html, un css et ca simplifie énormément le javascript

surtout que si tu ne code que sous ie6 la plupart de tes visiteurs vont avoir des surprises !

Discussions similaires

la balise <br> ou <br />

Bonjour,

Quelle est la difference entre la balise
et
?

Pourquoi utiliser l'un et pas l'autre ?

Merci d'avance,

Bonjour,

Comme on lit un peu tout et son contraire sur internet, je voudrais savoir quelle est la balise que l'on doit utiliser pour un retour à la ligne en HTML5.

Merci. :)

Configuration: Windows 7 / Chrome 22.0.1229.79

Balise </br>

Bonjour,

Je viens de créer un site web, et je me suis rendu sur W3C afin d'obtenir le www. mais le site m'affiche une erreur "End tag BR" (pour la balise
), ce que je ne comprends pas vu que le balise
n'existe pas (il me semble...)

Pouvez-vous m'aider svp ?
Merci d'avance et bonne journée !

Espace en HTML

En HTML, les espaces consécutifs sont ignorés par les navigateurs, au même titre que les retours chariots ou les tabulations. Pour insérer plusieurs espaces consécutifs, il est nécessaire d'utiliser une entité HTML spécifique, appelée espace insécable, dont le code HTML est le suivant : Pour faire des tabulations ou des mises en forme avancées, on peut recourir à la propriété CSS {white-space} . Cette propriété permet de définir si les espaces seront affichés ou pas. La valeur { white-space: pre } affiche tous les espaces. Voir la spécification du W3C et sa traduction en français

Saut de lignes sans <br/>

Bonjour,

Je ne savait pas comment faire un titre explicite donc voilà mon problème:

Je possède un système de news sur mon site mais à chaque fois lors de l'écriture je dois ajouter la balise
pour faire un saut de ligne.

J'ai cherché su google mais ne sachant pas quelle question poser j'ai du mal a bien cibler ma recherche.

Merci d'avance.

Configuration: Windows 7 / Firefox 5.0

Votre réponse

Discussions similaires