2013-04-08 4 views
1

У меня есть PHP программа, которая содержит Диву main_wrapper, что есть два деление с субом Div resultwrapper и adv_right. Я хочу, чтобы adv_right div был точно в правой части div div.When я использую float, означающий, что div присутствует вне div_ main_wrapper.Proplem в правом верхнем углу?

<style> 
.resultwrapper{width:990px; margin: 10px auto 10px auto; clear:both; } 
.resultitem{ float: left; 
    height: 170px; 
    margin-bottom: 0px; 
    margin-left: 10px; 
    min-height: 130px; 
    width:218px;} 
.resultleftitem{padding-left:0;margin-left:0px;} 
.resultitem img{border:dotted 1px #666; padding:6px;} 
.resultitem img:hover{border:solid 1px #F60;} 
.resultitem h4{font-size:12px; font-weight:bold; color:#249ce9; margin-top:5px; } 
.resultitem a{color:#249ce9;} 
.resultitem .caption{color:#9c9c9c; font-size:12px; display:block; margin-top:6px; text-align:justify;} 
</style> 
<div class="main_warpper"> 
<div class="resultwrapper"> 
<?php 
while($row = mysql_fetch_array($rs)) { 
     $id=$row['id']; 
     $type=$row['type']; 
     $location=$row['location']; 
     if(file_exists("properties//". $imageloc ."//thumb.jpg")) 
     { 
      $thumb_img="properties/". $imageloc ."/thumb.jpg"; 
     } else { 

      $thumb_img="images/default.jpg"; 
     } 
     if($cnt==0 || $cnt ==4) $newResult=true; else $newResult=false; 

?> 

<div id="parent" > 
    <div class="resultitem <?php if($newResult) echo ' resultleftitem'; ?>" id="resultitem"> <a href="viewpropdetails.php?id=<?php echo $id;?>" target="_blank"> 
    <img id="parent" src="<?php echo $thumb_img; ?>" alt="<?php $new=strtolower($heading); echo ucwords($new); ?>" title="<?php $new=strtolower($heading); echo ucwords($new); ?>" width="100" height="100" /></a> 
     <div class="itemdetails"> 
      <h4 id="linkheading"><a href="viewpropdetails.php?id=<?php echo $id;?>" target="_blank"><?php echo $type ." @ ".$location; ?></a></h4> 
      <span class="box"><?php echo cropStr($desc,$MAX_DESC); ?></span> 

     </div> 
    </div> 
    </div> 

<?php 
    $cnt++; } ?> 
</div> 

<div class="adv_right" style=" clear:both; width:15%; float:right;height:300px; background-color:#999999;"> 
    </div> 
</div> 
+0

main_warpper! = Main_wrapper ... и вы можете использовать jsfiddle или что-то писать читаемый код? – Shomz

+2

http://stackoverflow.com/questions/2716955/css-layout-aligning-two-divs-side-by-side –

ответ

2

Пожалуйста, попробуйте это,

Удалить ясно: both; как от сНа и установить ширину, что у хотят ,,

Пожалуйста, попробуйте этот код, который вы хотите, как это ??

<style> 
.resultwrapper { 
    margin: 10px auto 10px auto; 
} 
.resultitem { 
    float: left; 
    height: 170px; 
    margin-bottom: 0px; 
    margin-left: 10px; 
    min-height: 130px; 
    width:218px; 
} 
.resultleftitem { 
    padding-left:0; 
    margin-left:0px; 
} 
.resultitem img { 
    border:dotted 1px #666; 
    padding:6px; 
} 
.resultitem img:hover { 
    border:solid 1px #F60; 
} 
.resultitem h4 { 
    font-size:12px; 
    font-weight:bold; 
    color:#249ce9; 
    margin-top:5px; 
} 
.resultitem a { 
    color:#249ce9; 
} 
.resultitem .caption { 
    color:#9c9c9c; 
    font-size:12px; 
    display:block; 
    margin-top:6px; 
    text-align:justify; 
} 
</style> 
<div class="main_warpper"> 
    <div class="resultwrapper"> 
    <?php 
while($row = mysql_fetch_array($rs)) { 
     $id=$row['id']; 
     $type=$row['type']; 
     $location=$row['location']; 
     if(file_exists("properties//". $imageloc ."//thumb.jpg")) 
     { 
      $thumb_img="properties/". $imageloc ."/thumb.jpg"; 
     } else { 

      $thumb_img="images/default.jpg"; 
     } 
     if($cnt==0 || $cnt ==4) $newResult=true; else $newResult=false; 

?> 
    <div id="parent" > 
     <div class="resultitem <?php if($newResult) echo ' resultleftitem'; ?>" id="resultitem"> <a href="viewpropdetails.php?id=<?php echo $id;?>" target="_blank"> <img id="parent" src="<?php echo $thumb_img; ?>" alt="<?php $new=strtolower($heading); echo ucwords($new); ?>" title="<?php $new=strtolower($heading); echo ucwords($new); ?>" width="100" height="100" /></a> 
     <div class="itemdetails"> 
      <h4 id="linkheading"><a href="viewpropdetails.php?id=<?php echo $id;?>" target="_blank"><?php echo $type ." @ ".$location; ?></a></h4> 
      <span class="box"><?php echo cropStr($desc,$MAX_DESC); ?></span> </div> 
     </div> 
    </div> 
    <?php 
    $cnt++; } ?> 
    </div> 
    <div class="adv_right" style="width:15%; float:right;height:300px; background-color:#999999;">23123 </div> 
</div> 
1

добавить поплавок: левый здесь

 <div class="resultwrapper" style="float:left;"> 

и rempove ясно: как и добавить поплавок: левый

 <div class="adv_right" style=" clear:both; width:15%; float:left;height:300px; 
           background-color:#999999;"> 

посмотреть демо здесь .... http://jsfiddle.net/6e4xN/1/

+0

я также попробовать это, но его возвращение та же проблема. – nagaking

1

, когда вы собираетесь использовать этот код не будет работать с более чем 7-8 элементов, чтобы работать, когда у вас есть несколько элементов, а затем использовать ниже таблицы стилей.

<style> 
.resultwrapper { 
    margin: 10px auto 10px auto; 
    width:80%; 
    float:left; 
} 
.resultitem { 
    float: left; 
    height: 170px; 
    margin-bottom: 0px; 
    margin-left: 10px; 
    min-height: 130px; 
    width:150px; 
} 
.resultleftitem { 
    padding-left:0; 
    margin-left:0px; 
} 
.resultitem img { 
    border:dotted 1px #666; 
    padding:6px; 
} 
.resultitem img:hover { 
    border:solid 1px #F60; 
} 
.resultitem h4 { 
    font-size:12px; 
    font-weight:bold; 
    color:#249ce9; 
    margin-top:5px; 
} 
.resultitem a { 
    color:#249ce9; 
} 
.resultitem .caption { 
    color:#9c9c9c; 
    font-size:12px; 
    display:block; 
    margin-top:6px; 
    text-align:justify; 
} 
</style> 

Сообщите мне, если это сработает для вас или нет.

1

Я предполагаю, что есть какая-то проблема в коде. Вы НЕ МОЖЕТЕ использовать один и тот же идентификатор для нескольких элементов на странице. Во-вторых, когда вы используете процентную ширину для div adv_right, почему бы вам не использовать то же самое для div resultwrapper как с обработчиком результата &, так и с атрибутами adv_right dived left и no clear: оба в css. Я считаю, что это должно решить вашу проблему.