Databases
StackOverflow2013
Postsdbo
POjQuery Mobile Dialog button takes all the space
Body
 

Note that there are some explanatory texts on larger screens.

plurals
  1. POjQuery Mobile Dialog button takes all the space
    text
    copied!<p>I've set a dialog with a form in jQuery Mobile 1.3.1, and the button to submit the form is taking all the available space.</p> <p>With button at the end: <img src="https://i.stack.imgur.com/nN5lA.png" alt="enter image description here"></p> <p>As you can see, it's covering everything.</p> <p>Without it: <img src="https://i.stack.imgur.com/lmfBX.png" alt="enter image description here"></p> <p>Here it's fine, but I need the button to submit the data.</p> <p>I've tried to ser a jsFiddle to reproduce my issue, but I don't know how to set an example in this case, where I need two pages. I'm sorry.</p> <p>Here is the code used to build the dialog:</p> <pre><code>&lt;!DOCTYPE html&gt; &lt;html lang="es"&gt; &lt;body id="derp" data-role="page"&gt; &lt;header id="header" data-role="header" data-position="fixed" data-tap-toggle="false" data-theme="c"&gt; &lt;h1 id="titulo_header"&gt;Aaaaa &lt;/h1&gt; &lt;/header&gt; &lt;div data-role="content" data-theme="c"&gt; &lt;form method="post" action="#"&gt; &lt;fieldset data-role="controlgroup" data-mini="true" id="jv_add_jugadores_local"&gt; &lt;legend&gt;Aaaaa Aaaaa AaaaaaaAaaaa Aaaaa AaaaaaaAaaaa Aaaaa Aaaaaaa:&lt;/legend&gt; &lt;label&gt;01 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="2"&gt; &lt;/label&gt; &lt;label&gt;02 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="9341"&gt; &lt;/label&gt; &lt;label&gt;05 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="4"&gt; &lt;/label&gt; &lt;label&gt;09 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="336"&gt; &lt;/label&gt; &lt;label&gt;13 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="506"&gt; &lt;/label&gt; &lt;/fieldset&gt; &lt;fieldset data-role="controlgroup" data-mini="true" id="jv_add_jugadores_visitante"&gt; &lt;legend&gt;Aaaaa Aaaaa AaaaaaaAaaaa Aaaaa AaaaaaaAaaaa Aaaaa Aaaaaaa:&lt;/legend&gt; &lt;label&gt;03 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="9242"&gt; &lt;/label&gt; &lt;label&gt;09 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="1117"&gt; &lt;/label&gt; &lt;label&gt;11 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="464"&gt; &lt;/label&gt; &lt;label&gt;14 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="732"&gt; &lt;/label&gt; &lt;label&gt;18 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="9305"&gt; &lt;/label&gt; &lt;label&gt;22 -- Aaaaa Aaaaa Aaaaaaa &lt;input type="checkbox" name="eLoc[]" value="9241"&gt; &lt;/label&gt; &lt;/fieldset&gt; &lt;button type="submit" data-icon="check" id="add_jugadores"&gt;Añadir&lt;/button&gt; &lt;/form&gt; &lt;/div&gt; &lt;/body&gt; &lt;/html&gt; </code></pre> <p><strong>EDIT:</strong> This is the only CSS I used to style the dialog box:</p> <pre><code>.ui-dialog-contain { max-width: 900px !important; } </code></pre> <p>And this is what I was expecting to get (I edited the image, so it's not the solution) <img src="https://i.stack.imgur.com/Vibob.png" alt="enter image description here"></p>
 

Querying!

 
Guidance
An individual column

Larger individual text columns get their own page to allow for proper reading.

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload