За последние 24 часа нас посетили 62936 программистов и 1748 роботов. Сейчас ищут 757 программистов ...

Разъезжаются блоки сайта

Тема в разделе "HTML и CSS", создана пользователем zNR, 27 янв 2012.

  1. zNR

    zNR Активный пользователь

    С нами с:
    27 янв 2012
    Сообщения:
    3
    Симпатии:
    0
    Здравствуйте, сразу прошу сильно не пинать т.к только учусь :)
    В общем проблема в следующем - при увеличении масштаба в браузере, блоки сайта начинают разъезжаться, как их зафиксировать?

    Код (Text):
    1.  
    2. <body>
    3. <div id="all_box">
    4.     <div id="head" align="center"><img src="img/head1.png" width="100%" height="160"/>
    5.         <div id="logo1"><img src="img/slog.png"></div>
    6.         <div id="lang"><img src="img/lang_bot.png"></div>
    7.     </div>
    8.    
    9.     <div class="main">
    10.         <div class="left_b"></div>
    11.         <div class="right_b"></div>
    12.         <div class="center_b"></div>
    13.     </div>
    14. </div>
    15. </body>
    16. </html>
    Код (Text):
    1.  
    2. /* CSS Document */
    3.  
    4. body
    5. {
    6. margin:0;
    7. padding:0;
    8. background:url(img/BG.gif) repeat-x;
    9. }
    10.  
    11. #logo1{
    12. overflow:hidden;
    13. margin-top:-145px;
    14. margin-right:25%;
    15. font-family:"Times New Roman", Times, serif; font-size:26px; color:#666666;
    16. }
    17.  
    18. #lang
    19. {
    20. margin-top:-80px;
    21. margin-left:950px;
    22. }
    23.  
    24. .main{
    25. margin-top:9%;
    26. overflow:hidden;
    27. }
    28.  
    29. .left_b{
    30. float:left;
    31. background:red;
    32. width:250px;
    33. height:400px;
    34. }
    35. .right_b{
    36. float:right;
    37. background:blue;
    38. width:250px;
    39. height:300px;
    40. }
    41. .center_b{
    42. margin-left:250px;
    43. margin-right:250px;
    44. background:green;
    45. height:250px;
    46. }
     
  2. AndreJM

    AndreJM Активный пользователь

    С нами с:
    25 янв 2012
    Сообщения:
    522
    Симпатии:
    0
    А можно чуть поточнее?
    Ясное дело что все блоки у вас там двигаются причем в разных направлениях, но всё же чего вы хотите добиться?
    Чтобы цветные блоки с фиксированной шириной стояли на месте возле левого края окна браузера? Или шапка не расширялась? или что?
     
  3. zNR

    zNR Активный пользователь

    С нами с:
    27 янв 2012
    Сообщения:
    3
    Симпатии:
    0
    Вот измените масштаб у этого форума, весь контент остался посредине, как добиться этого в том коде что я привел? чтобы цветные блоки при изменении масштаба не ездили один влево другой вправо, естественно по логике и центральный расширяться после этого не будет.
     
  4. AndreJM

    AndreJM Активный пользователь

    С нами с:
    25 янв 2012
    Сообщения:
    522
    Симпатии:
    0
    Код (Text):
    1.  
    2. #all_box { width: 800px; margin: 0 auto;}
    Размер по вкусу.
    Удачи.
     
  5. zNR

    zNR Активный пользователь

    С нами с:
    27 янв 2012
    Сообщения:
    3
    Симпатии:
    0
    Благодарю