Div не плавающий

Я пытаюсь установить нижний колонтитул сайта.Div не плавающий

Проблема, похоже, связана с операцией float. .logo должен располагаться влево, но выравнивается вправо.

Это HTML:

<!doctype html> 
<html lang='es'> 
<head> 
    <meta charset='utf-8'> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta name="viewport" content="width=device-width, maximum-scale=1.0, minimum-scale=1.0, initial-scale=1.0" /> 
    <title>Dulkre</title> 

    <link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro' rel='stylesheet' type='text/css'> 
    <link rel="stylesheet" type="text/css" href="css/style.css" /> 
    <!-- HTML Snippet --> 

    <!--[if lt IE 9]> 
     <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> 
    <![endif]--> 
</head> 
<body> 
    <div id="page"> 
     <header> 
      <img src="./img/logo.png" id="logo" /> 

      <nav> 
       <ul> 
        <li class="current"> 
         <a href="#">Home</a> 
        </li> 
        <li> 
         <a href="#">Quienes Somos</a> 
        </li> 
        <li> 
         <a href="#">Productos</a> 
         <ul> 
          <li> 
           <a href="">Endulzantes</a> 
          </li> 
          <li> 
           <a href="">Life con sucralosa</a> 
          </li> 
          <li> 
           <a href="">Cl&aacute;sico</a> 
          </li> 
          <li> 
           <a href="">Fructofibra</a> 
          </li> 
          <li> 
           <a href="">Mate</a> 
          </li> 
          <li> 
           <a href="">Gourmet</a> 
          </li> 
         </ul> 
        </li> 
        <li> 
         <a href="#">Recetas</a> 
        </li> 
        <li> 
         <a href="#">Bienestar</a> 
        </li> 
        <li> 
         <a href="#">Contacto</a> 
        </li> 
       </ul> 
      </nav> 
     </header> 

     <section id="wrapper"> 
      <article id="slider"></article> 

      <article id="cuerpo"></article> 
     </section> 
    </div> 

    <footer> 
     <div id="pie"> 
      <div class="logo"> 
       <img src="./img/logo.png" /> 
      </div> 

      <div class="copy"></div> 
     </div> 
    </footer> 
</body> 
</html>

А вот CSS

footer{ height: 115px; width:100%; background: #aad361; } 
footer #pie { width:960px; margin:0 auto; height:115px; } 
footer #pie .logo { width:168px; float:left; display: block; } 

footer #pie .copy { margin-left: 198px; height:115px; display: block; width:762px; }

Любые идеи, что я делаю неправильно?

Вот URL, где вы можете увидеть весь код

http://dulkre.com.ar/newsite/

источник

2015-01-12 Pablo

Вы можете воссоздать thi вопрос в скрипке? – jmore009

ваш код работает здесь –

Я нашел то же самое, что и @MrBearandBeer, код, похоже, работает здесь – verrucktfuchs

Вы плавучий элемент DIV, когда вы должны плавать IMG.

Это правильный код:

HTML:

<footer> 
    <div id="pie"> 
     <img class="logo" class="img" src="./img/logo.png" /> 
    </div> 
</footer>

И CSS:

footer { 
    height: 115px; 
    width:100%; 
    background: #aad361; 
} 

footer #pie { 
    width:960px; 
    margin:0 auto; 
    height:115px; 
} 

footer #pie .logo { 
    width:168px; 
    float: left; 
}

Если вы хотите использовать свой код и достичь того же результата, просто используйте:

.footer #pie .logo img { 
    width:168px; 
    float: left; 
}

источник

2015-01-12 01:32:19

Результат sohuld будет таким же. .logo содержит изображение – Pablo

, но thtat был он jaja спасибо! – Pablo

Div не плавающий

ответ

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