Question

If you look at my document here: http://featuredfotografer.com/

you will see that there is a gutter to the left, and the width of both the .Codemirror div and the #header div are not filling the screen.

How can I do this with css or jquery (if i have to)?

I have already applied width:100% and height:100% to the corresponding elements and it doesn’t work. Something to do with the codemirror plugin overriding it, but how can I take control?

UPDATE:

width fixed, what about height?

Answer 1

Your docs.css have a max-width: 64.3em for body.

Remove it, or set max-width: 100%

#body { max-width: 100% }    
#header { position: fixed; z-index: 20 }    
.CodeMirror { padding-top: 32px }