Boootstrap container design on arcgis javascript api map div

Question

I am traying to use the bootstrap with arcgis javascript api. But I could not set the size of map div element 100% with and 100% height. The height is 400px; I tried set the css but not worked. example of application. And some pixels of map is under the navigation. I can not set the top of css.

Answer 1

You need to set any containers (html,body,.container,etc..) to 100% height also.

Also, the full-width container for Bootstrap 3.1 is container-fluid, so I changed your markup accordingly. The row is then used to eliminate the container-fluid's outer padding.

html,body{
    height:100%;
}

.row,.container-fluid{
    height:100%;
}

#map{
    height:100%;
    width:100%;
}

Fiddle: http://jsfiddle.net/zz85h/2/