Правая колонка уехала вниз в IE 6

Тема в разделе "CSS, HTML, Web 2.0, верстка по web-стандартам", создана пользователем marionjoy, 11.09.2008.

  1. Offline

    marionjoy Пользователь

    Регистрация:
    18.08.2008
    Сообщения:
    54
    Симпатии:
    0
    Пол:
    Женский
    Люди! Ну облазила тут все уже, кучу пособий прочитала, но никак не пойму, как же вот это исправить?
    В мозиле, IE 7 все красиво отбражается, а в IE 6 и ниже правая колонка опустилась вниз. Тут все пишутЮ надо пиксели или %% уменьшить, но вот я, безграмотная, не нашла что-то как быть, если код выглядит вот так:

    <div id="content">

    <?php if(mosCountModules( 'right' )>0 && mosCountModules( 'left' )>0){ ?>

    <div id="a"><?php mosLoadModules ( 'left', -2 ); ?></div>

    <div id="b"><?php mosMainBody(); ?></div>

    <div id="c"><?php mosLoadModules ( 'right', -2 ); ?></div>

    <?php }else if(mosCountModules( 'left' )>0 && mosCountModules( 'right' )<1){ ?>

    <div id="a"><?php mosLoadModules ( 'left', -2 ); ?></div>

    <div id="x"><?php mosMainBody(); ?></div>

    <?php }else if(mosCountModules( 'right' )>0 && mosCountModules( 'left' )<1){ ?>

    <div id="y"><?php mosMainBody(); ?></div>

    <div id="c"><?php mosLoadModules ( 'right', -2 ); ?></div>

    <?php }else{ ?>

    <div id="z"><?php mosMainBody(); ?></div>

    <?php } ?>

    </div>

    У меня еще и IE 7 стоит, я НЕ ВИЖУ, причем, что интересно, у знакомых версия 7.0.57.30.13 и колонки наезжают друг на друга, а уменя 7.057.30.11 и все настолько замечательно, что и не придерешься!

    Проявите сочувствие, я живу тут уже. Заранее благодарна:(
     
  2.  
  3. Fanamura
    Offline

    Fanamura Доброта

    Регистрация:
    12.03.2007
    Сообщения:
    5 108
    Симпатии:
    159
    Пол:
    Мужской
    самого главного нет для анализа... css ))
     
  4. Offline

    marionjoy Пользователь

    Регистрация:
    18.08.2008
    Сообщения:
    54
    Симпатии:
    0
    Пол:
    Женский
    А CSS такая

    Код (CODE):
    1. body{
    2.     margin: 0;
    3.     font-family: Tahoma, Georgia, "Times New Roman", Arial;
    4.     color: #333333;
    5.     font-size: 16px;
    6. }
    7.  
    8.  
    9.  
    10. #bigframe{
    11.  
    12.    
    13.     background-position: top left;
    14.  
    15.     background-repeat: repeat-x;
    16.  
    17.    
    18.  
    19.     top: 0;
    20.  
    21.     right: 0;
    22.  
    23.     bottom: 0;
    24.  
    25.     left: 0;
    26.  
    27.     width: 100%;
    28.  
    29.     height: 100%;
    30.  
    31.     margin: auto;
    32.  
    33.    
    34.  
    35.     text-align: center;
    36.  
    37. }
    38.  
    39.  
    40.  
    41. table.contentpaneopen td img {margin: 10px;}
    42.  
    43.  
    44.  
    45. #main{
    46.  
    47.     top: 0;
    48.  
    49.     right: 0;
    50.  
    51.     bottom: 0;
    52.  
    53.     left: 0;
    54.  
    55.     width: 100%;
    56.  
    57.     height: 100%;
    58.  
    59.     margin: auto;
    60.  
    61.    
    62.  
    63.     text-align: center;
    64.  
    65.    
    66.  
    67. }
    68.  
    69.  
    70.  
    71. #header{
    72.  
    73.     height: 240px;
    74.  
    75.     width: 992px;
    76.  
    77.     top: 0;
    78.  
    79.     right: 0;
    80.  
    81.     bottom: 0;
    82.  
    83.     left: 0;
    84.  
    85.     margin: auto;
    86.  
    87.     background-image: url(../images/head.jpg);
    88.  
    89. }
    90.  
    91. }
    92.  
    93.  
    94.  
    95. #logo{
    96.  
    97.     width: 218px;
    98.  
    99.     float: left;
    100.  
    101. }
    102.  
    103.  
    104.  
    105. #banner{
    106.  
    107.     width: 774px;
    108.  
    109.     float: right;
    110.  
    111.     top: 0;
    112.  
    113.     right: 0;
    114.  
    115.     bottom: 0;
    116.  
    117.     left: 0;
    118.  
    119.     margin: auto;
    120.  
    121. }
    122.  
    123.  
    124.  
    125. #bannertext{
    126.  
    127.     width: 760px;
    128.  
    129.     float: left;
    130.  
    131.     text-align: left;
    132.  
    133.     background-image: url('../images/bannerbg.gif');
    134.  
    135.     background-position: top left;
    136.  
    137.     background-repeat: no-repeat;
    138.  
    139.     height: 109px;
    140.  
    141.     margin-top: 16px;
    142.  
    143.    
    144.  
    145.     padding: 12px 16px 0px 16px;
    146.  
    147. }
    148.  
    149.  
    150.  
    151. #navi{
    152.  
    153.     height: 27px;
    154.  
    155.     top: 0;
    156.  
    157.     right: 0;
    158.  
    159.     bottom: 0;
    160.  
    161.     left: 0;
    162.  
    163.     margin: auto;
    164.  
    165.     width: 992px;
    166.  
    167. }
    168.  
    169.  
    170.  
    171. #googlenavi{
    172.  
    173.     margin-top: 4px;
    174.  
    175.     height: 21px;
    176.  
    177. }
    178.  
    179.  
    180.  
    181. #haku{
    182.  
    183.     width: 210px;
    184.  
    185.     float: right;
    186.  
    187.     height: 27px;
    188.  
    189.    
    190.  
    191.     background-image: url('../images/searchbg.jpg');
    192.  
    193.     background-position: top left;
    194.  
    195.     background-repeat: no-repeat;
    196.  
    197. }
    198.  
    199.  
    200.  
    201. #navigointi{
    202.  
    203.     width: 782px;
    204.  
    205.     float: left;
    206.  
    207.     height:27px;
    208.  
    209. }
    210.  
    211.  
    212.  
    213.  
    214.  
    215. #content{
    216.     top: 0;
    217.     right: 0;
    218.     bottom: 0;
    219.     left: 0;
    220.     margin: auto;
    221.     width: 990px;
    222. }
    223.  
    224.  
    225.  
    226. #a{
    227.  
    228.     float: left;
    229.  
    230.     width: 200px;
    231.  
    232.     margin: 16px 0px 50px 0px;
    233.  
    234. }
    235.  
    236.  
    237.  
    238. #b{
    239.  
    240.     float: left;
    241.  
    242.     width: 551px;
    243.  
    244.     margin: 16px 18px 50px 18px;
    245.  
    246.     text-align:left;
    247.  
    248. }
    249.  
    250.  
    251.  
    252. #c{
    253.  
    254.     width: 200px;
    255.  
    256.     float: right;
    257.  
    258.     margin: 16px 0px 50px 0px;
    259.  
    260. }
    261.  
    262.  
    263.  
    264. #d{
    265.  
    266.     width: 951px;
    267.  
    268.     float: left;
    269.  
    270.     margin: 0px 18px 0px 18px;
    271.  
    272. }
    273.  
    274.  
    275.  
    276. #x{
    277.  
    278.     width: 751px;
    279.  
    280.     margin: 16px 18px 50px 18px;
    281.  
    282.     float: right;
    283.  
    284.     text-align:left;
    285.  
    286. }
    287.  
    288.  
    289.  
    290. #y{
    291.  
    292.     width: 769px;
    293.  
    294.     margin: 0px 18px 0px 0px;
    295.  
    296.     float: left;
    297.  
    298.     text-align:left;
    299.  
    300. }
    301.  
    302.  
    303.  
    304. #z{
    305.  
    306.     width: 980px;
    307.  
    308. }
    309.  
    310.  
    311.  
    312. #footer{
    313.  
    314.     background-color: #ffffff;
    315.  
    316.     clear:both;
    317.  
    318.     height: 82px;
    319.  
    320.     margin-top: 50px;
    321.  
    322.     background-image: url('../images/footerbg.gif');
    323.  
    324.     background-position: top left;
    325.  
    326.     background-repeat: repeat-x;
    327.  
    328. }
    329.  
    330.  
    331.  
    332. #footertext{
    333.     padding-top: 28px;
    334.     top: 0;
    335.     right: 0;
    336.     bottom: 0;
    337.     left: 0;
    338.     margin: auto;
    339.     width: 992px;
    340.     font-family: Tahoma, Georgia, "Times New Roman", Arial;
    341.     color: #888888;
    342.     font-weight: normal;
    343.     font-size: 14px;
    344.     text-decoration:none;
    345. }
    346.  
    347.  
    348.  
    349. #copyright{
    350.  
    351.     width: 782px;
    352.  
    353.     text-align: left;
    354.  
    355.     float: left;
    356.  
    357. }
    358.  
    359.  
    360.  
    361. #copyright div{
    362.  
    363.     float: left;
    364.  
    365.     text-align: left;
    366.  
    367.     clear:both;
    368.  
    369. }
    370.  
    371.  
    372.  
    373. #some{
    374.  
    375.     width: 200px;
    376.  
    377.     float: right;
    378.  
    379.     top: 0;
    380.  
    381.     right: 0;
    382.  
    383.     bottom: 0;
    384.  
    385.     left: 0;
    386.  
    387.     margin: auto;
    388.  
    389. }
    390.  
    391.  
    392.  
    393. #left{
    394.     float: left;
    395.     width: 200px;
    396.     margin: 0;
    397. }
    398.  
    399.  
    400.  
    401. #basic{
    402.     float: left;
    403.     width: 580px;
    404.     background-color: red;
    405.     margin: 0;
    406. }
    407.  
    408.  
    409.  
    410. #right{
    411.     width: 200px;
    412.     float: right;
    413.     margin: 0;
    414.     text-align:right;
    415. }
    416.  
    417.  
    418.  
    419.  
    420.  
    421. #basic2{
    422.  
    423.     float: right;
    424.  
    425.     width: 770px;
    426.  
    427.     background-color: red;
    428.  
    429. }
    430.  
    431.  
    432.  
    433. /* for joomla */
    434.  
    435.  
    436.  
    437. #mod_search_searchword{
    438.  
    439.     border: none;
    440.  
    441.     height: 19px;
    442.  
    443.     background: transparent;
    444.  
    445.     font-size: 11px;
    446.  
    447.     font-weight: normal;
    448.  
    449.     width: 180px;
    450.  
    451.     margin: 4px 0px 0px 0px;
    452.  
    453.     padding-left: 10px;
    454.  
    455. }
    456.  
    457.  
    458.  
    459.  
    460.  
    461. div.search{
    462.  
    463.    
    464.  
    465.    
    466.  
    467. }
    468.  
    469.  
    470.  
    471. ul#mainlevel-nav
    472.  
    473. {
    474.  
    475.     list-style: none;
    476.  
    477.     padding: 0;
    478.  
    479.     margin: 0;
    480.  
    481.     font-size: 0.8em;
    482.  
    483. }
    484.  
    485.  
    486.  
    487. ul#mainlevel-nav li
    488.  
    489. {
    490.  
    491.     background-image: none;
    492.  
    493.     padding-left: 0px;
    494.  
    495.     padding-right: 0px;
    496.  
    497.     float: left;
    498.  
    499.     margin: 0;
    500.  
    501.     font-size: 11px;
    502.  
    503.     line-height: 21px;
    504.  
    505.     white-space: nowrap;
    506.  
    507.     border-right: 1px solid #cccccc;
    508.  
    509. }
    510.  
    511.  
    512.  
    513. ul#mainlevel-nav li a
    514.  
    515. {
    516.  
    517.     display: block;
    518.  
    519.     padding-left: 15px;
    520.  
    521.     padding-right: 15px;
    522.  
    523.     text-decoration: none;
    524.  
    525.     color: #333333;
    526.  
    527.     background: transparent;
    528.  
    529. }
    530.  
    531.  
    532.  
    533. #buttons>ul#mainlevel-nav li a { width: auto; }
    534.  
    535.  
    536.  
    537.     ul#mainlevel-nav li a:hover
    538.  
    539. {
    540.  
    541.     color: #fff;
    542.  
    543.     background: #ff7e02;
    544.  
    545. }
    546.  
    547.  
    548.  
    549. .maintitle {
    550.  
    551.     color: #ffffff;
    552.  
    553.     font-size: 40px;
    554.  
    555.     padding-left: 15px;
    556.  
    557.     padding-top: 20px;
    558.  
    559. }
    560.  
    561.  
    562.  
    563. .error {
    564.  
    565.   font-style: italic;
    566.  
    567.   text-transform: uppercase;
    568.  
    569.   padding: 5px;
    570.  
    571.   color: #cccccc;
    572.  
    573.   font-size: 14px;
    574.  
    575.   font-weight: bold;
    576.  
    577. }
    578.  
    579.  
    580.  
    581. .back_button {
    582.  
    583.     float: left;
    584.  
    585.   text-align: center;
    586.  
    587.   font-size: 11px;
    588.  
    589.   font-weight: bold;
    590.  
    591.   border: 3px double #cccccc;
    592.  
    593.   width: auto;
    594.  
    595.   background: url(../images/button_bg.png) repeat-x;
    596.  
    597.  
    598.  
    599.   padding: 0px 10px;
    600.  
    601.   line-height: 20px;
    602.  
    603.   margin: 1px;
    604.  
    605. }
    606.  
    607.  
    608.  
    609. .pagenav {
    610.  
    611.   text-align: center;
    612.  
    613.   font-size: 11px;
    614.  
    615.   font-weight: bold;
    616.  
    617.   border: 3px double #cccccc;
    618.  
    619.   width: auto;
    620.  
    621.   background: url(../images/button_bg.png) repeat-x;
    622.  
    623.   padding: 0px 10px;
    624.  
    625.   line-height: 20px;
    626.  
    627.   margin: 1px;
    628.  
    629. }
    630.  
    631.  
    632.  
    633. .pagenavbar {
    634.  
    635.     margin-right: 10px;
    636.  
    637.     float: right;
    638.  
    639. }
    640.  
    641.  
    642.  
    643. ul{
    644.  
    645.     margin: 0;
    646.  
    647.     padding: 0;
    648.  
    649.     list-style: none;
    650.  
    651. }
    652.  
    653.  
    654.  
    655. ul li{
    656.  
    657.     background-image: url('../images/bullet.gif');
    658.  
    659.     background-repeat: no-repeat;
    660.  
    661.     background-position: top left;
    662.  
    663.     padding-left: 15px;
    664.  
    665. }
    666.  
    667.  
    668.  
    669. ol{
    670.  
    671.     margin: 0;
    672.  
    673.     padding: 0px 0px 0px 17px;
    674.  
    675.    
    676.  
    677. }
    678.  
    679.  
    680.  
    681. ol li{
    682.  
    683.     background-image: none;
    684.  
    685. }
    686.  
    687.  
    688.  
    689. /* Joomla core stuff */
    690.  
    691. a:link, a:visited {
    692.  
    693.     color: #8d6301;
    694.  
    695.     text-decoration: none;
    696.  
    697.     font-weight: normal;
    698.  
    699. }
    700.  
    701.  
    702.  
    703. a:hover {
    704.  
    705.     color: #8d6301;
    706.  
    707.     text-decoration: none;
    708.  
    709.     font-weight: normal;
    710.  
    711. }
    712.  
    713.  
    714.  
    715. .blogsection{
    716.     font-weight: normal;
    717.     font-family: Georgia, "Times New Roman", Times, serif;
    718.     font-size: 14px;
    719. }
    720.  
    721.  
    722.  
    723. table.contentpaneopen {
    724.     width: 100%;
    725.     padding: 0px;
    726.     border-collapse: collapse;
    727.     border-spacing: 0px;
    728.     margin: 0px;
    729.     font-family: Georgia, "Times New Roman", Times, serif;
    730.     font-size: 14px;
    731.     color: #474747;
    732. }
    733.  
    734.  
    735.  
    736. table.contentpaneopen td {
    737.     /*padding-right: 5px;*/
    738.  
    739.    padding: 0;
    740.     font-family: Georgia, "Times New Roman", Times, serif;
    741.     font-size: 14px;
    742. }
    743.  
    744.  
    745.  
    746. table.contentpaneopen td.componentheading {
    747.     padding-left: 4px;
    748.     font-family: Georgia, "Times New Roman", Times, serif;
    749.     font-size: 14px;
    750. }
    751.  
    752.  
    753.  
    754. table.contentpane {
    755.     width: 100%;
    756.     padding: 0px;
    757.     border-collapse: collapse;
    758.     border-spacing: 0px;
    759.     margin: 0px;
    760.     font-family: Georgia, "Times New Roman", Times, serif;
    761.     font-size: 14px;
    762.     color: #474747;
    763. }
    764.  
    765.  
    766.  
    767.  
    768.  
    769. table.contentpane td {
    770.  
    771.     margin: 0px;
    772.  
    773.     padding: 0px;
    774.  
    775. }
    776.  
    777.  
    778.  
    779. table.contentpane td.componentheading {
    780.  
    781.     padding-left: 4px;
    782.  
    783. }
    784.  
    785.  
    786.  
    787. table.contentpaneopen fieldset {
    788.  
    789.     border: 0px;
    790.  
    791.     border-bottom: 1px solid #eee;
    792.  
    793. }
    794.  
    795.  
    796.  
    797. .button {
    798.  
    799.   color: #ff7e02;
    800.  
    801.   font-family: Arial, Hevlvetica, sans-serif;
    802.  
    803.   text-align: center;
    804.  
    805.   font-size: 11px;
    806.  
    807.   font-weight: normal;
    808.  
    809.   border: 3px double #cccccc;
    810.  
    811.   width: auto;
    812.  
    813.   background: url(../images/button_bg.png) repeat-x;
    814.  
    815.   padding: 0px 5px;
    816.  
    817.   line-height: 18px !important;
    818.  
    819.   line-height: 16px;
    820.  
    821.   height: 26px !important;
    822.  
    823.   height: 24px;
    824.  
    825.   margin: 1px;
    826.  
    827. }
    828.  
    829.  
    830.  
    831. .inputbox {
    832.  
    833.     padding: 2px;
    834.  
    835.     border:solid 1px #cccccc;
    836.  
    837.     background-color: #ffffff;
    838.  
    839.     font-size: 12px;
    840.  
    841.     color: #474747;
    842.  
    843. }
    844.  
    845.  
    846.  
    847. .componentheading {
    848.  
    849.     font-family: Trebuchet MS;
    850.  
    851.     font-size: 20px;
    852.  
    853.    
    854.  
    855.     color: #ff7e02;
    856.  
    857.     font-weight: bold;
    858.  
    859. }
    860.  
    861.  
    862.  
    863. .contentcolumn {
    864.  
    865.     padding-right: 5px;
    866.  
    867. }
    868.  
    869.  
    870.  
    871. .contentheading{
    872.  
    873.     font-family: Trebuchet MS;
    874.  
    875.     font-size: 20px;
    876.  
    877.    
    878.  
    879.     color: #ff7e02;
    880.  
    881.     font-weight: bold;
    882.  
    883. }
    884.  
    885.  
    886.  
    887. .contentpagetitle {
    888.  
    889.     font-family: Trebuchet MS;
    890.  
    891.     font-size: 20px;
    892.  
    893.    
    894.  
    895.     color: #ff7e02;
    896.  
    897.     font-weight: bold;
    898.  
    899.     text-align:left;
    900.  
    901. }
    902.  
    903.  
    904.  
    905. table.searchinto {
    906.     width: 100%;
    907.     font-family: Arial;
    908.     color: #474747;
    909.     font-size: 12px;
    910. }
    911.  
    912.  
    913.  
    914. table.searchintro td {
    915.     font-weight: bold;
    916.     font-family: Arial;
    917.     color: #474747;
    918.     font-size: 12px;   
    919.  
    920. }
    921.  
    922.  
    923.  
    924. table.moduletable{
    925.  
    926.     padding: 0px 10px 0px 10px;
    927.  
    928.     margin: 0px 0px 20px 0px;
    929.  
    930.     background-image: url('../images/modulebg.gif');
    931.  
    932.     background-position: top left;
    933.  
    934.     background-repeat: no-repeat;
    935.  
    936.    
    937.  
    938.     width: 200px;
    939.  
    940.    
    941.  
    942.     text-align:left;
    943.  
    944.     font-family:Arial;
    945.  
    946.     font-size: 11px;
    947.  
    948.     line-height: 1.5em;
    949.  
    950.     color: #474747;
    951.  
    952.    
    953.  
    954.     border-spacing: 0px;
    955.  
    956.     border-collapse: collapse;
    957.  
    958. }
    959.  
    960.  
    961.  
    962.  
    963.  
    964. div.moduletable{
    965.     padding: 0px 0px 0px 0px;
    966.     margin: 0px 0px 20px 0px;
    967.     background-image: url('../images/modulebg.gif');
    968.     background-position: top left;
    969.     background-repeat: no-repeat;
    970.     text-align:left;
    971.     font-family:Tahoma, Georgia, "Times New Roman", Arial;
    972.     font-size: 14px;
    973.     line-height: 1.5em;
    974.     color: #474747;
    975.     text-align: center;
    976. }
    977.  
    978.  
    979.  
    980. div.moduletable h3 {
    981.  
    982.     background-image: url('../images/arrow.gif');
    983.  
    984.     background-position: top left;
    985.  
    986.     background-repeat: no-repeat;
    987.  
    988.    
    989.  
    990.     color: #ff7e02;
    991.  
    992.     text-align: left;
    993.  
    994.     font-family: Trebuchet MS;
    995.  
    996.    
    997.  
    998.    
    999.  
    1000.     margin-left: 43px;
    1001.  
    1002.     padding-left: 43px;
    1003.  
    1004.     height: 36px;
    1005.  
    1006.     line-height: 36px;
    1007.  
    1008.    
    1009.  
    1010.     font-weight: bold;
    1011.  
    1012.     font-size: 14px;
    1013.  
    1014.     margin: 0;
    1015.  
    1016. }
    1017.  
    1018.  
    1019.  
    1020. div.moduletable p{
    1021.     font-family: Trebuchet MS;
    1022.     pad
     
    Последнее редактирование модератором: 14.09.2008
  5. doctorgrif
    Offline

    doctorgrif специалист

    Регистрация:
    14.01.2008
    Сообщения:
    1 284
    Симпатии:
    66
    Пол:
    Мужской
    Оффтопик (не в тему) - жми сюда!
     
  6. Offline

    marionjoy Пользователь

    Регистрация:
    18.08.2008
    Сообщения:
    54
    Симпатии:
    0
    Пол:
    Женский
    Знаете что, вместо того, чтобы умничать, помогли бы лучше. Мне в нашей деревне пойти спросить не у кого, сами поживите в городишке с населением в 100 тысяч, где одни продавцы-консультанты требуются! Я по человечески же о помощи прошу, просили код RSS, я его и разместила, я понимаю, что длинный, а что делать, не я же его придумала. Я прошу помощи, и если не можете помочь, так и оскорблять не надо!
     
  7. Offline

    _voland_ специалист

    Регистрация:
    12.04.2008
    Сообщения:
    2 173
    Симпатии:
    102
    Пол:
    Мужской
    1) Сами в таком городке живем... аську и гугль никто не отменял
    2) по делу коммент - можно и вложением CSS оформить
    3) лично мне влом писать страничку и линковать урл, проще если дадите ссылку на нее
     
  8. Offline

    feNDer2k5 Недавно здесь

    Регистрация:
    20.01.2008
    Сообщения:
    3
    Симпатии:
    0
    Пол:
    Мужской
    C IE6 вечно проблемы. Я решил такую же проблему отдельным css под ie6. Нужно уменьшать ширину уехавших блоков на 10-20 px иначе они как бы выдавливаются ))
     
  9. Offline

    AnyOne Недавно здесь

    Регистрация:
    20.09.2008
    Сообщения:
    19
    Симпатии:
    1
    Пол:
    Женский
    Прикрепи файлы к сообщению, так нервно а то выходит.
    Могу посоветовать на будущее интересный сайт http://builder.yaml.de/, там можно и посмотреть и скопировать код внешнего вида.
     

Поделиться этой страницей

Загрузка...