Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>You can't subtract pixels from percentages, this isn't your answer, but I suggest learning the basics of css first, otherwise you will have no idea why things work the way they do.</p> <p>Here is a good website with a lot of layout examples and tutorials: <a href="http://www.maxdesign.com.au/articles/css-layouts/" rel="nofollow">http://www.maxdesign.com.au/articles/css-layouts/</a></p> <p>And <a href="http://www.w3schools.com/" rel="nofollow">http://www.w3schools.com/</a> for css standards.</p> <p>As far as your particular situation is concerned, you are taking the wrong approach. If you want to be able to subtract width from 100% you can use javascript to accomplish this goal. with jquery you can do something like this:</p> <pre><code>$("#div").width($(window).width() - 125); </code></pre> <p>This will not work once the window resizes however. You can add resize events to resize your div when the window resizes but this is cumbersome and can seem laggy. Your best bet is to use a css implementation, your question is quite vague though, you seem to be describing a two column layout with a side panel, but I could be wrong. Just for a two column layout there are different options such as whether you want your main content to be liquid or static.</p> <p>I'm assuming liquid because it is more useful.</p> <p>I would like to recommend jquery layout for creating layouts. Uses javascript and it's very easy to use to make quick layouts. <a href="http://layout.jquery-dev.net/" rel="nofollow">http://layout.jquery-dev.net/</a></p> <p>Here is your solution: <a href="http://jsfiddle.net/Z3nfv/1/" rel="nofollow">http://jsfiddle.net/Z3nfv/1/</a></p>
    singulars
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload