SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Member
    Join Date
    May 2007
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    CSS Layout and Hidden Fields

    Hello group - my hidden elements are messing up my form page layout.

    CSS :
    input type=["hidden"] {
    display: none;
    visibility: none;
    }

    HTML:
    <form action="registration.cgi" method="POST">
    <input type="hidden" name="IDNUM" value="4">
    <fieldset><legend>Restrictions</legend>
    <div id="regBox2">
    blah blah blah
    </div>
    </fieldset>
    </form>

    It is creating white space - horizontally and vertically - where the hidden elements are.

    WHY! Any advice is hugely appreciated.

    david

  2. #2
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,516
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    What browser is this happening in.?

    IE6 doesn't understand attribute selectors so the style will not be applied and you would need to add a class (and it should be visibility:hidden not none, although it wouldn't be necessary because display:none would remove it from the flow anyway).

    I think we'd need a link to the page as the code above doesn't cause any whitespace as it is.

    Have you cleared all the margins from the form and other elements you are using.

  3. #3
    SitePoint Member
    Join Date
    May 2007
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    What browser is this happening in.?
    grr. Good point Paul - and thanks for the reply.

    here is your link :
    http://checkeredshirt.com/1notgood.html

    Good in IE.
    bad in Netscape and Firefox!

    Maybe I'm wrong that the hidden elements are screwing up the layout then ? Perhaps it something else ?

    david

  4. #4
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,516
    Mentioned
    182 Post(s)
    Tagged
    6 Thread(s)
    HI,

    It is your hidden inputs but you have a mistake in the css.

    use this:
    Code:
            input[type=hidden]{
                display: none;
            }

  5. #5
    SitePoint Member
    Join Date
    May 2007
    Posts
    3
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by Paul O'B View Post
    HI,
    It is your hidden inputs but you have a mistake in the css.

    use this:
    Code:
            input[type=hidden]{
                display: none;
            }
    Ack!! Hi Again Paul -

    THANK YOU for replying. I initially did not copy and paste your code - and I did not notice the opening square bracket.

    It is fixed - thanks again - perfect!

    david


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •