fixed-carousal-fluid-right-block

fixed carousal and fluid container

by manu v

HTML

<div class="container">
  <div class="right">
    <p class="text">
    our carousal, width/height now is half of actual. Just for demo
    </p>
  </div>

  <div class="left">
    <div class="left-sub-block">
      <div class="text-block">

      </div>
      <h2 class="text">notifications</h2>
      <div class="">
        <div class="">
          <p class="text">
            These orders need your attention:
          </p>
          <div>
            <ul class="text-ul">
              <li>Order date Aug 8</li>
              <li>Order date Aug 5</li>
            </ul>
          </div>
        </div>
      </div>
    </div>
  </div>
</div>

CSS

body {
  background: #ffffff;
}

.container {
  height: auto;
  overflow: hidden;
}
h2 {
  margin:0px;
}
.text {
  padding:5px 10px;
}

.text-ul {
  padding: 5px 0px 0px 25px;
}

.left {
  float: none;
  background: #fff;
  width: auto;
  overflow: hidden;
  padding: 0px 20px;
}

.left-sub-block {
  background: #e8f6fe;
  min-height: 184px;
}

.text-block {
  padding: 0px 15px;
}

.right {
  width: 385px;
  height: 184px;
  float: right;
  background: #f2f2f2;
}