Плавающий div справа

Question

В следующем HTML-файле .left имеет float: right, который нельзя изменить. Можно ли переместить .right div в правую сторону, не меняя поплавок: прямо в .left div?

HTML:

<div class="box"> 
    <div class="wrap"> 
     <div class="left">This should be left.</div> 
    </div> 
    <div class="right">This should be right</div>  
</div> 

CSS:

.box{ 
    width: 300px; 
    overflow: hidden; 
    border: 1px solid red;  
} 

.left{ 
    width: 100px; 
    float: right; /* cannot change */ 
    border: 1px solid blue;  
} 

.right{ 
    width: 100px; 
    float: right; 
    border: 1px solid green; 
} 

Демо: http://jsfiddle.net/y5UEu/

Answer 1

просто сделать это

HTML

<div class="box"> 
    <div class="wrap"> 
     <div class="left leftCol">This should be left.</div> 
    </div> 
    <div class="right">This should be right</div>  
</div> 

CSS

.box{ 
    width: 300px; 
    overflow: hidden; 
    border: 1px solid red;  
} 

.left{ 
    width: 100px; 
    float: right; 
    border: 1px solid blue;  
} 

.right{ 
    width: 100px; 
    float: right; 
    border: 1px solid green; 
} 
.leftCol { 
    float:left !important; 
} 

demo

Answer 2

Вы можете поставить правильный DIV перед тем левых дел.

<div class="box"> 
    <div class="wrap"> 
     <div class="right">This should be right</div> 
     <div class="left">This should be left.</div> 
    </div> 

</div> 

JS Fiddle

Answer 3

Другой способ:

Если вы не можете изменить структуру HTML,
вы можете применить некоторые CSS к классу обруча,
, так как это уже есть.

.wrap { 
    width: 198px; 
    float: left; 
} 

Ширина 198px - полиция с вашей границей.
Вы можете изменить это на все, что хотите, в соответствии с вашими требованиями.

Свойство float left на классе .wrap может дать вам то, что вы хотите.

Answer 4

попробовать с этим

Добавьте к этому Css Код:

.wrap{ 

поплавок: слева;
}

HTML:

<div class="box"> 
    <div class="right">This should be right</div> 
<div class="wrap"> 
    <div class="left">This should be left.</div> 
</div> 

Answer 5

Просто определите:

.left {поплавок: левый!важный; }

Это вытеснит существующий .left {float:right;}

я предполагаю, что вы не можете изменить HTML, так что это решение, которое работает в ситуациях, когда применяются пользовательские CSS на существующий веб-сайт.

Answer 6

<div class="box"> 
    <div class="right">This should be right</div> 
    <div class="wrap"> 
    <div class="left">This should be left.</div> 
    </div> 
</div>