#3432 closed defect (duplicate)
RadioButton layout in Dialog is skewed
| Reported by: | guest | Owned by: | bill |
|---|---|---|---|
| Priority: | high | Milestone: | 0.9 |
| Component: | Dijit - Form | Version: | 0.9 |
| Keywords: | Cc: | ||
| Blocked By: | Blocking: |
Description
I've placed a vertical group of two RadioButtons? in a Dialog. The buttons show up as 'one-and-half' buttons before the label field. Non-dojo radiobuttons look fine in Dialog. Code for dialog table:
<table>
<tr>
<td>Create Container</td>
<td>
<input type="radio" name="grp1" id="contRadio1" value="inselected" dojoType="dijit.form.RadioButton"/>
<label for="contRadio1">inside the selected Container</label><br/>
<input type="radio" name="grp1" id="contRadio2" value="astop" dojoType="dijit.form.RadioButton"/>
<label for="contRadio2">as top Container</label>
</td>
</tr>
<tr>
<td>Other input fields</td>
<td>And submit buttons</td>
</tr>
</table>
I have a screenshot of it, didn't know how to put it here in the most sensible way.
Anni
Attachments (2)
Change History (10)
comment:1 Changed 12 years ago by
comment:2 Changed 12 years ago by
This is with Firefox 1.5.0.12. Dojo 0.9 nightly 20/Jun/2007. It appears that omitting @import "../../../dojo/resources/dojo.css"; style causes this problem. Testcase is here, modified from test_Dialog.html
<html>
<head>
<title>Dialog Widget Dojo Tests</title>
<style type="text/css">
@import "../../themes/tundra/tundra.css";
@import "../css/dijitTests.css";
table { border: none; }
</style>
<style type="text/css">
body { font-family : sans-serif; }
form {
margin-bottom : 0;
}
</style>
<script type="text/javascript"
djConfig="isDebug: true"
src="../../../dojo/dojo.js"></script>
<script type="text/javascript">
dojo.require("dijit.layout.Dialog");
dojo.require("dijit.form.Checkbox");
dojo.require("dojo.parser"); // scan page for widgets and instantiate them
</script>
</head>
<body class="tundra">
<h2>Dijit layout.Dialog tests</h2>
<a href="javascript:dijit.byId('dialog1').show()">Show First Dialog</a>
<p>Vestibulum convallis eros ac justo. Proin dolor. Etiam aliquam. Nam
ornare elit vel augue. Suspendisse potenti. Etiam sed mauris eu neque
nonummy mollis. Vestibulum vel purus ac pede semper accumsan. Vivamus
lobortis, sem vitae nonummy lacinia, nisl est gravida magna, non cursus
est quam sed urna. Phasellus adipiscing justo in ipsum. Duis sagittis
dolor sit amet magna. Suspendisse suscipit, neque eu dictum auctor,
nisi augue tincidunt arcu, non lacinia magna purus nec magna. Praesent
pretium sollicitudin sapien. Suspendisse imperdiet. Class aptent taciti
sociosqu ad litora torquent per conubia nostra, per inceptos
hymenaeos.
</p>
<div dojoType="dijit.layout.Dialog" id="dialog1" closeNode="hider" title="First Dialog">
<form onsubmit="return false;">
<table>
<tr>
<td><label for="name">Radiobuttons: </label></td>
<td><p>
<input type="radio" name="g1" id="contParentCheck1" value="selected" checked="checked" dojoType="dijit.form.RadioButton"/>
<label for="contParentCheck1">checked</label><br />
<input type="radio" name="g1" id="contParentCheck2" value="root" dojoType="dijit.form.RadioButton"/>
<label for="contParentCheck2">not checked and long label</label>
</p>
</td>
</tr>
<tr>
<td><label for="name">Name: </label></td>
<td><input type="text" id="name"></td>
</tr>
<tr>
<td><label for="loc">Location: </label></td>
<td><input type="text" id="loc"></td>
</tr>
<tr>
<td><label for="desc">Description and with very long label to screw layout: </label></td>
<td><input type="text" id="desc"></td>
</tr>
<tr>
<td colspan="2" align="center">
<input type="button" id="hider" value="OK"></td>
</tr>
</table>
</form>
</div>
</body>
</html>
comment:3 Changed 12 years ago by
Again, as I said above, attach testcases to the bug using the "Attach File" button.
Firefox 1.5 is not support by Dijit, or my Mozilla, for that matter. Does it happen on FF2?
comment:4 Changed 12 years ago by
PS: had a few typos above. I meant to say "Firefox 1.5 is not supported by Dijit, or by Mozilla, for that matter. Does it happen on Firefox 2?"
Changed 12 years ago by
| Attachment: | testcase.html added |
|---|
comment:5 Changed 12 years ago by
Attahed testcase as a file. This occurs in FF2 as well, using nightly 26.Jun. Note that testcase paths have now changed since Dialog apparently moved from dijit.layout to dijit root this weekend.
comment:6 Changed 12 years ago by
| Milestone: | → 0.9 |
|---|
comment:7 Changed 12 years ago by
| Resolution: | → duplicate |
|---|---|
| Status: | new → closed |
addressed in #3666, so this is technically a duplicate. synopsis: tundra.css assumes the inclusion of dojo.css in some cases (default td and margin settings) ... suggest merge dojo.css into dijit.css as part of 'dijit' ... as dojo core (shouldn't) need any additional styling to work at all?
comment:8 Changed 8 years ago by
| Component: | Dijit → Dijit - Form |
|---|
Hi Anni - both screenshots and testcases should be attached to the bug using the "Attach File" button but you need to submit the bug first and then attach afterwards. The button doesn't appear when creating a new bug.
Also should list what browser it happens on.
Your example above isn't a full testcase. It doesn't include dojo, and it doesn't even have a dijit.layout.Dialog, does it? So pleae attach one.