Where to put interest?

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>School.ua</title> <style type="text/css/"> body.style_body { background-image: url(images/fon.jpg); background-attachment: scroll; background-clip: border-box; background-origin: padding-box; direction: ltr; display: block; overflow-y: scroll; margin: 0; padding: 0; } .gods_area { background: #D954FF; width:1263px; height:82px; border-bottom: 2px solid black; margin: 0; padding: 0; } .info_area { background: trensparent; width: 500px; height: 516px; } .choise_area { position: relative; background: trensparent; width: 761px; height: 516px; margin-left: 500px; margin-top: -516px; border-left:2px solid black; } .screenwriter_area { background: #DAABF2;; width:1263px; height:82px; border-top:2px solid black; border-bottom: 2px solid black; margin: 0; padding: 0; } </style> </head> <body class="style_body"> <div id="gods_area" class="gods_area"></div> <div id="line_area" class="line_area"> <div id="info_area" class="info_area"></div> <div id="choise_area" class="choise_area"></div> </div> <div id="screenwriter_area" class="screenwriter_area"></div> </body> </html>

    3 answers 3

    Do you need a rubber or fixed design? Or mixed?

    For rubber, as an option:

     .info_area { width: 35%; height: 516px; } .choise_area { width: 64%; height: 516px; margin-left: 35%; margin-top: -516px; border-left:2px solid black; }

    By the way, not background: trensparent; , and background: transparent;

    And in general, draw a diagram of what you want to get, it will greatly speed up the solution to the problem.

      Do not specify all as a percentage! Only that it is necessary to "rezinovit"! Then you will not turn back problems, since not all browsers perceive this absolutely correctly. Better make a content block with fixed sizes, and make an auto margin on the sides of it. The option is already somewhat old-fashioned, but reliable and proven.

        Maybe because the "rubber" assumes all values ​​in % , and not px , like you?

        • I need to make it look normal on different manitors, for this you need to specify all values ​​as percentages? - Zow
        • Interest should be done only in width height. And how to specify the margin-top in px - Zow
        • familiar with calc for css? - root_x Povierennyy