Ширина компоновки css

Я не могу вместить все изображения в одну строку. Изображения имеют ширину 210 пикселей, без полей, без прокладки без рамки, а контейнер имеет ширину 1050 пикселей. Без полей, без заполнения, без границы, поэтому 210x5 = 1050px, должно соответствовать?Ширина компоновки css

<!DOCTYPE html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Ejercicio 9</title> 
    <style> 
     body{ 
      margin:0; 
      white-space: nowrap; 
     } 
     #bolas{ 
      margin: auto auto; 
      width: 1050px; 
      } 

     .bolas_billar{ 
      margin: 0; 
      padding: 0; 
      /* 
      display: inline; 
      position: relative; 
      top: 50%; 
      margin-top: -85px; 
      */ 
     } 

    </style> 
</head> 
<body> 
    <div id="bolas"> 
     <img id="bola7" class="bolas_billar" src="./images/bola7.jpeg" alt="Bola billar 7" width="210" height="170"> 
      <img id="bola8" class="bolas_billar" src="./images/bola8.jpeg" alt="Bola billar 8" width="210" height="170"> 
     <img id="bola9" class="bolas_billar" src="./images/bola9.jpeg" alt="Bola billar 9" width="210" height="170"> 
     <img id="bola10" class="bolas_billar" src="./images/bola10.jpeg" alt="Bola billar 10" width="210" height="170"> 
     <img id="bola13" class="bolas_billar" src="./images/bola13.jpeg" alt="Bola billar 13" width="210" height="170"> 
    </div> 
</body> 
</html>

http://jsfiddle.net/x2mv94vm/

источник

2014-10-28 user2670996

использование [Flexbox] (http://css-tricks.com/ сниппеты/CSS/а-руководство к Flexbox /) –

Добавить font-size:0 в основной контейнер #bolas. Если вы хотите какой-то текст внутри контейнера, то указать размер шрифта отдельно:

body { 
    margin:0; 
} 
#bolas { 
    margin: auto auto; 
    width: 1050px; 
    font-size:0; // Added 
} 
.bolas_billar { 
    margin: 0; 
    padding: 0; 
}

Демо: http://jsfiddle.net/lotusgodkk/x2mv94vm/3/

источник

2014-10-28 09:32:13

float:left Используйте, чтобы они плавали рядом друг.

.bolas_billar { 
    margin: 0; 
    padding: 0; 
    float:left; 
}

http://jsfiddle.net/x2mv94vm/4/

источник

2014-10-28 09:34:10 secelite

добавить "float:left" свойство ".bolas_billar"

источник

2014-10-28 09:34:42 theinvisible

body{margin:0;}

добавить этот код

#bolas{margin: 0 auto;width: 1050px;float:left;} 

.bolas_billar{margin: 0;padding: 0;}

источник

2014-10-28 10:06:29

Ширина компоновки css

ответ

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