[css layout][04] three percentage columns

1.我猜作者肯定这样弄的

#wrapper {
  width: 100%;
  float: left;
}
#content {
  margin-right: 50%;
}
#navigation {
  float: left;
  width: 25%;
  margin-left: -25%;
}
#extra {
  float: left;
  width: 25%;
  margin-left: -50%;
}
#footer {
  clear: both;
}

果然..

2.float向右

#wrapper {
  width: 100%;
  float: right;
}
#content {
  margin-right: 50%;
}
#navigation {
  float: right;
  width: 25%;
  margin-right: -100%;
}
#extra {
  float: right;
  width: 25%;
  margin-right: -75%;
}
#footer {
  clear: both;
}

3.#wrapper宽度50%，全部左浮动

#wrapper {
  width: 50%;
  float: left;
}
#navigation {
  float: left;
  width: 25%;
  margin-right: -25%;
  position: relative;
  left: 25%;
}
#extra {
  float: left;
  width: 25%;
}
#footer {
  clear: both;
}

4.#wrapper宽度50%全部float向右

#wrapper {
  width: 50%;
  float: right;
  margin-left: -50%;
  position: relative;
  left: -50%;
}
#navigation {
  float: right;
  width: 25%;
}
#extra {
  float: right;
  width: 25%;
}
#footer {
  clear: both;
}