javascript - A delete button is hiding behind another element. How can I make that element to be at the top so it's visible? -


i'm trying draw delete button right @ right top corner of collapsible box. did reason can't make show @ top of collapsible element it's visible. tried set visibility: visible still can't make visible. ideas or suggestions appreciated.

here's html code:

<div data-role='main' class='ui-content' id='collapse'>     <div data-role='collapsible' data-theme='b' data-content-theme='b' data-iconpos='right' data-expanded-icon='collapse' data-collapsed-icon='expand'>         <h4>              <a href='#' data-rel='back' data-role='button' data-icon='delete' data-iconpos='notext' style='position:absolute;top:-20px;right: -10px'>close</a>               <div class='ui-grid-a'> <div class='ui-block-a textfloatleft' > 1 new </div>              <div class='ui-block-b textfloatright'>january 6th 2016</div>         </div>          <span id='collapstxt'> first </span>           <button href='#' id='bt01' data-icon='check' data-iconpos='right' style='width:100px;' onclick='alert(1);event.stoppropagation();' >reply</button>         </h4>          <ul data-role='listview'>             <li id='answerstyle'><span id='answerstxt'> first </span>                 <div class='ui-block-b answrfloatright'>january 6th 2016</div>             </li>             <li id='answerstyle'>audi</li>             <li id='answerstyle'>bmw</li>             <li id='answerstyle'>cadillac</li>             <li id='answerstyle'>ferrari</li>         </ul>     </div> </div> 

and jsfiddle example

to effect yore looking need add overflow: visible; containing element:

a.ui-collapsible-heading-toggle.ui-btn.ui-icon-expand.ui-btn-icon-right.ui-btn-b { overflow:visible;}

here js fiddle


Comments

Popular posts from this blog

authentication - Mongodb revoke acccess to connect test database -

r - Update two sets of radiobuttons reactively - shiny -

ios - Realm over CoreData should I use NSFetchedResultController or a Dictionary? -