Comment centrer mon logo image à une autre div en CSS à l'horizontale et à la verticale?
J'ai besoin d'aide pour le positionnement d'un logo horizontalement centre. Il doit également être centré verticalement vers le haut de mes liens div
. Quelqu'un peut-il m'aider?
J'aimerais que mon logo pour ressembler à ceci:
Ci-dessous mon code HTML et CSS:
HTML - http://codebin.org/view/199faa14
<div id="container">
<div id="logo">
<img src="images/images/logo.gif" />
</div>
<div id="navigation">
navigation
</div>
<div id="header">
</div>
<div id="line">
</div>
<div id="content">
content
</div>
</div>
CSS - http://codebin.org/view/dda88d94
body {
background: url(../images/images/bg_page.gif) center center;
}
#container {
width: 940px;
margin: 0 auto;
}
#header {
height: 281px;
background: url(../images/home/header.gif) top center;
position: relative;
}
#logo {
position: absolute;
z-index: 2;
top: 0px
height: 214px;
margin: 10px auto 0 auto;
}
#navigation {
position: relative;
height: 40px;
background: #fff;
margin-top: 100px
}
#content {
height: 541px;
background: url(../images/home/bg_body.png) top center;
position: relative;
}
#line {
height: 4px;
background: url(../images/home/line.gif) top center;
position: relative;
}
Vous devez mettre à jour votre question, pas besoin d'ajouter des liens dans les commentaires.
Veuillez inclure le code + le format de la question correctement la prochaine fois
Ajouter un jsfiddle.
Veuillez inclure le code + le format de la question correctement la prochaine fois
Ajouter un jsfiddle.
OriginalL'auteur user2445229 | 2013-06-02
Vous devez vous connecter pour publier un commentaire.
essayer quelque chose comme cela avant à l'aide de javascript!
ou cette!
a travaillé comme un charme le premier merci pour l'aide très appréciée! je viens de mettre le logo dans la navigation de la div et l'a utilisé comme conteneur pour elle
pas de prob! 🙂 pour vous permettre de régler ce post que le droit de réponse si elle n'en résoudra vos problèmes
ok bien je vais le faire dès maintenant
OriginalL'auteur Anze
Je crois que je comprends de votre question. Depuis que vous appelez votre logo img dans le code html, essayez ceci.
et dans le CSS, vous devez modifier votre code pour le #logo img{ //entrez le code ici }
OriginalL'auteur ValleyDigital
Vous pourriez réaliser avec:
Démonstration faite dans un contexte similaire pour quelqu'un d'autre :
http://dabblet.com/gist/5375725
OriginalL'auteur G-Cyr
Certaines personnes face à certains problèmes lors de l'utilisation de l'vertical-align: middle; style de l'attribut. CSS doit être écrit dans le questionneur. Pour les personnes à la recherche d'une solution rapide.
*assurez-vous que le conteneur a la position:relative; attribut css.
Il est facile handeling rétine et compatible avec tous les types de CSS des balises. espérons que cette technique simple peut sauver un peu de temps pour les gens 🙂
OriginalL'auteur directory