If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 3 of 3
  1. #1
    Junior Member
    Join Date
    Feb 2009
    Member #

    This problem arose from trying to format a form with all the "input" boxes lined up regardless of the width of the label. This can be done by positioning the labels absolutely and the input fields relatively, but this positions the labels in relation to the left edge of the overall window, which with fluid designs is not always going to be known.

    So, I experimented with giving the labels an absolute width value, and then positioning the input fields relative to them. This seemed to work in IE7 under HTML 4.01 - the labels were fixed width OK. But in Firefox and Safari, and in all three browsers with XHTML 1.0, the so called fixed width labels reverted to being the width of actual contents.

    Replicating this with <span> elements for simplicity, I've got:

    .aaa { width:100px}
    .bbb {position:relative; left:80px;}

    And then the html:

    <p><span class="aaa">Jack in the </span><span class="bbb">box</span></p>
    <p><span class="aaa">Jack in </span><span class="bbb">the box</span></p>
    <p><span class="aaa">Jack </span><span class="bbb">in the box</span></p>

    Basically, I want the right hand text to be lined up, regardless of what I written in the left hand text.

    Or even more basically - can you force the width of an element?




  3. #2
    WDF Staff mlseim's Avatar
    Join Date
    Apr 2004
    Cottage Grove, Minnesota
    Member #
    720 times
    Steve ...

    Not sure, but I assumed you already looked here?

    There are so many possibilities, and many of the examples shown
    will cover all of the different browsers.

  4. #3
    Junior Member
    Join Date
    Feb 2009
    Member #
    Thanks for the link - I must admit I hadn't gone looking because the problem isn't one directly to do with forms.

    I really can't see how something as basic as "width" can be treated so differently by different browsers. Is the definition of css and/or html really so lax or is it that browser developers just do their own thing.

    And if they get this wrong, then what chance for more complicated designs.

    I'm clearly not the first to bemoan browser problems - I just see it as inefficient to have to spend time sorting out "workarounds" for things that are supposed to be standards.

    Sorry - moan over, and back to looking for how others have done it.

    Thanks again,


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
All times are GMT -6. The time now is 09:03 PM.
Powered by vBulletin® Version 4.2.3
Copyright © 2020 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: