2014-01-16 4 views
0

Я пытаюсь плавать свой логотип слева в заголовке, но он вообще не плавает налево. Я был бы очень признателен, если бы кто-то мог указать нашу мою ошибку, так как я новичок в CSS.Логотип не плавает влево в заголовке?

Это мой сайт, если вы хотели бы видеть мою проблему живой: http://cashski.com/

Вот мой HTML код:

<div id="navigation"> 
    <div class="center_navigation"> 
     <a href="contact.php">Contact</a> 
     <a href="buy-instagram-followers.php">Instagram Followers</a> 
     <a href="buy-instagram-photo-likes.php">Instagram Photo Likes</a> 
     <a href="index.php"><img src="img/logo.png" /></a> 
    </div> 
</div> 

Вот мой CSS код:

body { 
    padding: 0px; 
    margin: 0px; 
    font-family: Optima, Segoe, "Segoe UI", Candara, Calibri, Arial, sans-serif; 
} 
#navigation{ 
    width: 100%; 
    height: 50px; 
    margin: 0px auto; 
    position: relative; 
    background-color: #2d5b89; 
    border-bottom: 1px solid #244a75; 
} 
.center_navigation { 
    width: 960px; 
    height: 50px; 
    margin:0px auto; 
    font-size: 16px; 
} 
.center_navigation a { 
    padding: 10px 0 10px 30px; 
    float: right; 
    margin-top: 4px; 
    color: #babcc5; 
    text-decoration: none; 
} 
.center_navigation a:hover { 
    color: white; 
} 
.center_navigation a img { 
    float: left; 
} 
+0

Вот ваша проблема: '.center_navigation в {поплавок: право ; } ' – melancia

ответ

4

проблема - все ваши anchor теги: float:right, а ваше изображение находится внутри метки anchor, поэтому сделать img float:left не меняется очень много.

Так что вам либо нужно поместить стиль в контейнер изображения, то есть. Тег привязки, как это

<a href="index.php" style="float: left;"> 
    <img src="img/logo.png"> 
</a> 

или если ваш образ всегда в последний якорь тега, то вы также можете использовать этот

.center_navigation a:last-child{ 
    float: left; 
} 

Js Fiddle Demo

+0

Хорошо, спасибо за помощь! – user3167464

+0

+1 для упоминания ': last-child' – melancia

Смежные вопросы