css - Aligning an INPUT and a DIV side by side -


i'm trying align real button , fake button on single line. i've been asked make link button created image sprite it. problem is, can't input , div play nice.

    <div class="submitform">         <input type="submit" value="rename" />         <div class="smallbutton">@html.actionlink("cancel", "siteindex", new { id = @html.displayfor(model => model.siteid) })</div>         @html.hiddenfor(model => model.siteid)     </div> 

above html (asp.net mvc 4) , below css:

.smallbutton {     display: inline; }  .smallbutton {     color: #000 !important;     font-family: arial;     font-size: 13px;     padding: 3px 15px;     background: url('../../images/smallbtn.jpg') 0 0; }  .smallbutton a:hover {     color: #000 !important;     background: url('../../images/smallbtn.jpg') 0 -26px; }  .smallbutton a:active {     color: #000 !important;     background: url('../../images/smallbtn.jpg') 0 -52px; } 

i forgot clarify, need aligned in ie 6 , ie 7. should in chrome.

  • if use display:inline, have use in both of input , div. css apply display:inline div.
  • another way of doing float:left input field.
  • you can use twitter bootstrap span class.

Comments

Popular posts from this blog

linux - xterm copying to CLIPBOARD using copy-selection causes automatic updating of CLIPBOARD upon mouse selection -

c++ - qgraphicsview horizontal scrolling always has a vertical delta -