Tutorial :Aligning checkboxes via inherited css?



Question:

I have a php page, which launches a popup window containing a form with checkboxes. The originating window includes an external stylesheet.

The form html for the popup window is:

<form name="statusForm" action="post.php=" method="post" enctype="multipart/form-data">  <label for="Test">Test:</label>  <input name="checkboxes[]" value="Test" type="checkbox">  <br>  <label for="Test">TestTest:</label>  <input name="checkboxes[]" value="Test" type="checkbox">  <br>  <label for="Test">TestTestTest:</label>  <input name="checkboxes[]" value="Test" type="checkbox">  <br>  <input name="Submit" value="submit" type="submit">  </form>  

The form has been trimmed, and fields renamed to test for posting..

In the external stylesheet, I have:

label {      min-width: 5em;  }  

The checkboxes are still not aligned. Do I have to included the stylesheet explicitly in the html of the popup window, or is it something else?


Solution:1

Yes, the popup window needs to be its own full HTML page.


Edit

Unless it is an AJAX popup, in which case it does NOT need to be a full HTML page.


Solution:2

New windows don't inherit any kind of stylesheet rules from their parents.

Also, if you're using Firefox, I urge you to install the Firebug extension, which will allow you to 'Inspect' an HTML element to see (and even modify) the active CSS rules.


Solution:3

Keep in mind that min-width is not supported in Internet Explorer 6. Also, I'd use some dividing element like <div> or <li> (within an <ul>) rather than a <br />.

Rich


Note:If u also have question or solution just comment us below or mail us on toontricks1994@gmail.com
Previous
Next Post »