SitePoint Sponsor

User Tag List

Results 1 to 3 of 3
  1. #1
    SitePoint Evangelist optl's Avatar
    Join Date
    Oct 2004
    Location
    Washington DC
    Posts
    415
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Why won't my form elements center?

    http://www.paramountconstruction.net...?id=floorplans
    http://www.paramountconstruction.net...ault/style.css

    I have even tried using <center>.....</center> still didn't work. I know it is probably something that is being inherited. Anyone have any ideas?
    For the phrase "Bethesda home architect", my clients
    websites occupy 6 of the first 8 results
    on the 1st page of Google. My Secret SEO Strategy Revealed

  2. #2
    SitePoint Zealot
    Join Date
    Aug 2007
    Location
    Toronto
    Posts
    184
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    It does seem to be an ineritance issue. You've got a huge amount of elements nested leading up to the forms, so it's difficult to figure out what is causing the issue, but I seemed to temporarily get it working when I added "text-align: center" to your universal selector, like this:

    Code:
    * {
       text-align: center;
    }
    Of course, that also centered everything else...

    But it seems you changed the page while I was fiddling because it suddenly stopped working, and the width of that form holder was suddenly different. But yes, you'll have to hunt down hierarchically what is causing the problem.

    Louis

  3. #3
    The CSS Clinic is open silver trophybronze trophy
    Paul O'B's Avatar
    Join Date
    Jan 2003
    Location
    Hampshire UK
    Posts
    40,355
    Mentioned
    179 Post(s)
    Tagged
    6 Thread(s)
    The problem is that all elements have been set to text-align:left via the universal selector here.

    Code:
    * { margin:0; padding:0; vertical-align:top; font-family:Arial, Helvetica, sans-serif; font-size:medium; color:#333333; text-align:left; }
    Remove that text-align:left and the page will start working again.

    There is no need to abuse the universal selector like that and applying all those properties to every single element on your page is a huge overkill.

    Just apply them to the body element and let inheritance do the rest. The only properties you should apply globally would be margin:0 and padding:0 end even then you are better off using a proper reset technique instead because of the issues with forms.


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
  •