css - Multiple buttons and search placement in header for jQuery Mobile? -

I am trying to add a search input and three buttons on the same line in jQuery mobile, but this is happening This is really a disappointing code I'm trying to:

  & lt; Div data-role = "header" class = "header" & gt; & Lt; Input type = "search" name = "search" id = "search-title" value = "" data-mini = "true" data-inline = "correct" data-theme = "c" /> & Lt; A href = "# menu_page" data-roll = "button" data-icon = "search" data-icon = "note" & gt; Search & lt; / A & gt; & Lt; A href = "# menu_page" data-roll = "button" data-icon = "grid" data-icon- "notes" data-rel = "dialog" & gt; View & lt; / A & gt; & Lt; A href = "# menu_page" data-roll = "button" data-icon = "arrow-D" data-icon- "note" "data-relay =" dialog "& gt; menu & lt; / a & gt;   
 with a CSS of:  
  .page.header .ui-input-search {margin-right : 90px;}   
 I'm okay to use the default icon coming with JQM, but the appointment looks like this:  
   
 I also have buttons and buttons around the input box. Tried to put a control group on the sides, but put the button below the search box.  
 How do I get it in JQM?   
 
 
 Have you tried to delete the margin? Well I see that there may be some problems, besides you may want to float your images.  
 I have a solution here: