-2

I'm trying to figure out how to create a fluid layout with a fixed width sidebar and fluid content area using Jeet.

HTML:

<div class="wrapper">
    <div class="sidebar"></div>
    <div class="content"></div>
</div>

CSS:

.wrapper {
    width: 100%;
}
.sidebar {
    width: 240px;
}

Looks like it is not possible with Jeet to set the content css to take rest of the layout, is it so?

tamilsweet
  • 1,007
  • 8
  • 15
  • Questions asking us to suggest, find or recommend a book, tool, software library, plug-in, tutorial, explain a technique or provide any other off-site resource are off-topic for Stack Overflow Stack Overflow – Paulie_D Oct 18 '16 at 10:07
  • I rephrased the question, I just followed another question using different framework @ http://stackoverflow.com/questions/21967723/susy-2-fixed-width-sidebar-with-fluid-main-content-area – tamilsweet Oct 18 '16 at 12:12

1 Answers1

0

You have to use define content width

HTML CODE 

<div class="wrapper">
    <div class="sidebar">
      <div class="content-box">
        Content Here !!!! 
      </div>
    </div>
    <div class="content">
    <div class="content-box">
        Content Here !!!! 
      </div>
    </div>
</div>

CSS CODE

.wrapper {
  color: #fff;
}
.sidebar {
  width:30%;
  display:inline-block;
  float: right;
  background: #333;
}
.content {
  width: 70%;
  display: inline-block;
  background: #666;
}
.content-box {
  padding: 20px;
}

Please check Demo Here https://jsfiddle.net/568447zu/

Shahzeib Ali
  • 43
  • 4