0

I try to absolute positioning couple of img elements inside one .branch_item element who should have position: relative.

Everything works fine when .branch_item has with and height in px, but I need them in % not px (because this element should have 100% of width). The % unit works only with fixed position, but it can't be in that position.

My code looks like:

<div class="container left">
  <div class="twelve columns">
    <div class="branch_item">
      <div class="csc-row">
        <figure class="csc-image csc-image-first csc-image-last">
          <img src="uploads/pics/bg_01.png" alt="" />
        </figure>
      </div>
      <div class="csc-row">
        <figure class="csc-image csc-image-first csc-image-last">
          <img src="uploads/pics/de.act.png" alt="" />
        </figure>
      </div>
      <div class="csc-row">
        <figure class="csc-image csc-image-first csc-image-last">
          <img src="uploads/pics/lx.act.png" alt="" />
        </figure>
      </div>
      <div class="csc-row csc-row-last">
        <figure class="csc-image csc-image-first csc-image-last">
          <img src="uploads/pics/pl.act.png" alt="" />
        </figure>
      </div>
    </div>
    <div class="twelve columns menu-bar">
    </div>
  </div>
</div>

and here is my css code:

.branch_item {
  background: #ECECED; 
  position: relative;
  top: 50px; 
  left: 0;
  width: 100px;
  height: 100px;
}

.branch_item img {
  position:absolute; 
  top:0px; 
  left:25%; 
  width:50%;
}

When I set in .branch_item element width and height in % unit I have blank page without anything.

Anyone know how to set it?

4

1 回答 1

0

当您以百分比设置宽度和高度时，它会相对于其父项进行测量。你有设置的高度和宽度<div class="twelve columns">吗？（不是百分比）如果不是，.branch_item则不能有百分比高度。

于 2013-08-14T10:56:23.977 回答