3 плавающих элемента div в контейнере фиксированной ширины, элемент div переходит вниз, когда размер файла равен размеру фиксированного элемента div с границей - PullRequest
Новая
       7

3 плавающих элемента div в контейнере фиксированной ширины, элемент div переходит вниз, когда размер файла равен размеру фиксированного элемента div с границей

0 голосов
/ 16 мая 2011

Загрязненный заголовок, но у меня не было другого способа описать это.Что я пытаюсь сделать, так это то, что у меня есть 3 boex в строке с границей только в 1 пиксель с каждой стороны, но я не могу заставить ее работать, это всегда 2 пикселя в крайнем правом углу.Как решить эту проблему?

Проверьте код: 

#content {
  width: 1016px;
  min-height: 664px;
  height: auto;
  border: 1px solid #232323;
  background-color: #12100e;
  float: left;
  padding: 0px;
}

#imagebox {
  Width: 338px;
  height: 221px;
  padding-right: 0px;
  padding-left: 0px;
  border-right: 1px solid #232323;
  border-bottom: 1px solid #232323;
}

<html>
  <head>
    <link rel="StyleSheet" href="Main.css" type="text/css">
    <title></title>
  </head>
  <body>
    <div id="mainbody">
      <div id="menu"></div>
      <div id="content">
        <div id="imagebox"></div>
        <div id="imagebox"></div>
        <div id="imagebox"></div>
        <div id="imagebox"></div>
        <div id="imagebox"></div>
        <div id="imagebox"></div>
        <div id="imagebox"></div>
        <div id="imagebox"></div>
        <div id="imagebox"></div>
      </div>
    </div>
  </body>
</html>

Ответы [ 3 ]

0 голосов
/ 16 мая 2011

Ближайшие вы можете получить:

http://jsfiddle.net/CGEWC/2/

Несколько вещей, которые вы должны иметь в виду:

Используйте классы вместо идентификаторов, если вам нужно назначитьстиль несколько раз.

В вашем CSS вы используете ширину с большой буквы.Хотя CSS не чувствителен к регистру, проще написать все строчными буквами.

Я добавил float: left; в ваши графические окна

Я добавил первый и последний классы в ваш div.Не самый чистый код, но это должно быть слово.

0 голосов
/ 04 декабря 2013

Вы пытались использовать max-width вместо width? Это позволяет уменьшать объект. Если нужно, просто уберите 1 из одного, и все должно быть в порядке, и измените идентификаторы на класс, поскольку они все одинаковые.

0 голосов
/ 16 мая 2011

Это потому, что правая граница добавляет 1px к общей ширине элемента #imagebox, что делает ширину 339px.

Попробуйте уменьшить ширину до 337px, и они должны всевписывается

...