CSS Divs перекрывают друг друга

Question

Привет всем это мой CSS для DIV

<style type="text/css"> 
    #container 
    { 
     width: 100%; 
     padding-right: 200px; 
    } 

    #autowidth 
    { 
     width: 80%; 
     float: right; 
     z-index: 1; 
     position: relative; 
    } 

    #fixed 
    { 
     width: 20%; 
     position: fixed; 
     z-index: 1; 
     float: left; 
     margin-right: -200px; 
    } 
</style> 

и это мой дизайн

<div id="container"> 
<div id="fixed"> 
<table> 
    // my controls 
</table> 
</div> 
<div id="autowidth"> 
<table> 
    // my controls 
</table> 
</div> 
</div> 

Но когда я выбираю какой-то длинный текст в 2 DIV являются перекрывающихся

Answer 1

Удалить: margin-right: -200px;

или margin-right :0.

Answer 2

Я думаю, что это может решить проблему:

1.Try, чтобы установить ширину для DIV, который в настоящее время внахлест. (или) 2.Try Inline css.

Я могу помочь лучше, если вы поделитесь снимками экрана.

Answer 3

просто изменил положение бита ваш CSS удалить: фиксированный, и добавил дисплей: стол-элементная/таблица, в которой требуется надеюсь, что это поможет:

#container { 
     width: 100%; 
     padding-right: 200px; 
     display:table; 
    } 
    #autowidth { 
     width: 80%; 
     display:table-cell; 
     z-index: 1; 
     position: relative; 

    } 
    #fixed { 
     width: 20%; 
     z-index: 1; 
     display:table-cell; 
     margin-right: -200px; 

    } 

другое решение может быть, чтобы удалить позицию: фиксированный и добавить окно -sizing: граница-бокс для левого и правого дивы

#container { 
    width: 100%; 
    padding-right: 200px; 
} 
#autowidth { 
    width: 80%; 
    float: right; 
    z-index: 1; 
    position: relative; 
    box-sizing:border-box; 

} 
#fixed { 
    width: 20%; 
    z-index: 1; 
    float: left; 
    margin-right: -200px; 

    box-sizing:border-box; 
}