Question

I have a fixed size layout, centered using margin: 0 auto. I wonder whether it is possible to do such a thing with CSS: i need my layout to have right margin two times less then left. Something like:

<-- (2*n px margin) [fixed width div] (n px margin) -->

How? (using css only)

Answer 1

I know you said CSS only, but I’d suggest using javascript in the following way:

function repad()
        {
            if (navigator.appName=="Microsoft Internet Explorer")
            {
                var pad = ((document.documentElement.clientWidth-*FIXEDDIVWIDTH*)/3);
            }
            else
            {
                var pad = ((window.innerWidth-*FIXEDDIVWIDTH*)/3);
            }

            document.getElementById("*FIXEDDIV*").style.marginLeft = ((pad*2)+"px");
        }

Obviously replacing things in *’s with their proper values.

This way it’s scalable to the browser size