Question

I have a fixed nav bar at the top and a container with a full width Background spanning span12. but since the content of the background image is crucial for the layout for visual cue. i want the whole image to be displayed at all times irrespective of the window size.

Which is the best way to construct the image or set of images to achieve the same.

Large Monitor

Medium Monitor

Small Size

I have a form that will be displayed to the right of the image. Hence making it a little tricky for me to get the image working.

Link: play.mink7.com/minkstock/

Answer 1

If I understand correctly, you want just to have a maximum size (or percentage) that your image can reach. Try, instead of a background image, using a <img> element like so:

img{
   max-width: 100%; /* or any other value */
   height: auto;
}