2016-10-10 4 views
0

Hi Ich entwickle MVC4-Anwendung. Ich habe ein Hauptteil darin, dass ich drei div Tags habe. Die ersten zwei Div-Tags werden gemäß meiner Anforderung korrekt angezeigt. Allerdings erscheint mein drittes Div-Tag in der Mitte. Ich will es in der linken unteren Seite. Ich habe alle Wege ausprobiert.Wie richtet man Div auf der rechten Seite aus?

<div id="dialog" class="doc-verification-outer"> 
    <div id="data" style="width:70%;height:inherit;float:left" class="doc-verification"></div> 
    <div id="details" width="30%" style="float:right;height:50%; width:30%"></div> 
    <div id="dialog-form" title="Reject Reason"> 
     <div style="height:200px;"> 
      <input type="hidden" value="_upload_id" id="id" /> 
      <br /> 
      <label for="name">Select your reason</label> 
      <select id="comments"> 
       <option value="1">Incorrect Document</option> 
       <option value="2">document is not clear</option> 
       <option value="3">document is not valid</option> 
       <option value="4">other document</option> 
      </select> 
      <input type="button" id="reject" class="btn btn-primary btn-cons blue" value="Ok" onclick="reject();" tabindex="-1" style="float:right;"> 
     </div> 
    </div> 
</div> 

Kann mir jemand etwas dazu sagen? Vielen Dank ...

+0

Entwarnung geben: sowohl CSS-Style-Eigenschaft auf dritte div. @Niranjan Godbole – Dhaarani

+0

Erklären Sie klar Sie wollen links unten oder rechts unten –

+0

Rechts unten. Clear: Beide funktionieren gut, aber es geht ganz nach links. Ich möchte es sofort unter Details div –

Antwort

2

Sie können dies versuchen:

<div id="dialog" class="doc-verification-outer"> 
 
    <div id="data" style="width:70%;height:inherit;float:left" class="doc-verification"></div> 
 
    <div id="details" width="30%" style="float:right;height:50%; width:30%"></div> 
 
    <div id="dialog-form" title="Reject Reason"> 
 
     <div> 
 
      <input type="hidden" value="_upload_id" id="id" /> 
 
      <br /> 
 
      <label for="name">Select your reason</label> 
 
      <select id="comments"> 
 
       <option value="1">Incorrect Document</option> 
 
       <option value="2">document is not clear</option> 
 
       <option value="3">document is not valid</option> 
 
       <option value="4">other document</option> 
 
      </select> 
 
      
 
     </div> 
 
     <div style="margin-top:5px;"><input type="button" id="reject" class="btn btn-primary btn-cons blue" value="Ok" onclick="reject();" tabindex="-1" style="margin-left:122px;"></div> 
 
    </div> 
 
</div>

1

Ich glaube, Sie müssen auch die dritte div in zwei Teile geteilt, so der rechte Teil ausrichten sollten mit Ihrem zweite div Versuchen Sie folgendes:

<div id="dialog" class="doc-verification-outer"> 
    <div id="data" style="width:70%;height:inherit;float:left" class="doc-verification">First DIV</div> 
    <div id="details" width="30%" style="float:right;height:50%; width:30%">Second div</div> 
    <div style="clear:both"></div> 
    <div id="dialog-form" title="Reject Reason"> 
     <div style="height:200px;"> 
      <div style="width:70%;display:inline-block"> 
      <input type="hidden" value="_upload_id" id="id" /> 
      <br /> 
      <label for="name">Select your reason</label> 
      <select id="comments"> 
      <option value="1">Incorrect Document</option> 
      <option value="2">document is not clear</option> 
      <option value="3">document is not valid</option> 
      <option value="4">other document</option> 
     </select> 
      </div> 
      <div style="width:29%;display:inline-block"> 
       <input type="button" id="reject" class="btn btn-primary btn-cons blue" value="Ok" onclick="reject();" tabindex="-1" style="float:left;"> 
      </div> 
     </div> 
    </div> 
</div> 

+0

Vielen Dank für Ihre Nachricht. Ja, aber Drop-Down kommt links unten und OK-Button rechts unten. Ich möchte beide rechts unten anzeigen. –

Verwandte Themen