Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 5 of 5
  1. #1
    New Coder
    Join Date
    Jul 2007
    Posts
    11
    Thanks
    3
    Thanked 0 Times in 0 Posts

    text centering help (css)

    this is the site which I'm trying to make
    Click here (700x700)

    and here are the results:
    http://www1.freewebs.com/emaj/test.htm

    this is my third attempt at creating a css-based layout
    I need the text in the navigation area (e.g home, portfolio, contact me,etc)
    to be centered.
    I used text-align: center but it didn't work
    One more thing, I did try validating it but it it says invalid and I tried to fix it but it doesn't seem it's working.

    http://validator.w3.org/check?uri=ht...verbose=1&st=1
    I tried fixing it but it messes up my layout.

    Any help would be appreciated and thank you in advance :)
    Last edited by Emaj; 10-14-2007 at 04:01 AM.

  • #2
    New Coder
    Join Date
    Aug 2007
    Posts
    58
    Thanks
    2
    Thanked 6 Times in 6 Posts
    I've spent two hours on it mate, and I can't get it to work. The only thing I could tell you to do is to just use a div and have the a tags immediately inside, no containing divs. But then when you use a background image on it, it gets inconsistent.

    The problem is that when you say float:left, it clears the margin: 0 auto; I know this can be done, I would have to recode your code from scratch, which I don't want to do. I've spent too much time on it already. Good luck, mate!

  • Users who have thanked Blue_Jeans for this post:

    Emaj (10-14-2007)

  • #3
    Senior Coder
    Join Date
    Apr 2007
    Location
    Quakertown PA USA
    Posts
    1,028
    Thanks
    1
    Thanked 125 Times in 123 Posts
    Just taking a quick glance:

    1. Your use of the <ul> is not correct. It's a good idea to use a <ul> element for navigation, but it needs to contain <li> elements and not <div>'s. A number of examples can be found at Listamatic.

    2. In your css you have defined #body{} yet you have no tag with an id of #body. If you intended that to apply to the <body> tag it should be body{}.

    If fixing the validation errors "messes up your layout", the reason is the html and/or css used to create that layout is a mess.

  • Users who have thanked PappaJohn for this post:

    Emaj (10-14-2007)

  • #4
    New Coder
    Join Date
    Jul 2007
    Posts
    11
    Thanks
    3
    Thanked 0 Times in 0 Posts
    Thanks for the suggestion, I was confused about the "body" tag but you cleared it up! Well it doesn't surprise me that my css/html is all messy, thanks for the help and pointing me to the right direction :P

    to Blue_Jeans: Dam, 2 hours! Sorry for using your valuable time, and it be nice to have my work coded so I can compare it to my messed up work but thanks for trying to fix it
    Last edited by Emaj; 10-14-2007 at 06:31 PM. Reason: Adding Compliments!

  • #5
    New Coder
    Join Date
    Jun 2007
    Location
    Quebec, Canada
    Posts
    64
    Thanks
    4
    Thanked 3 Times in 3 Posts
    hi Emaj, i came to a similar problem with my site.

    i ended up putting the UL in a DIV given an ID of wrapper, and centering it using text-align:center AND margin:0 auto

    see it here, along with the css : http://www.veksen.net http://www.veksen.net/c/a01.css

    i have a much more recent version on my laptop which doesnt have access to the internet. (see the footer not wanting to clear in IE, but much more..)

    hope this can help you on the right track, and good luck with xhtml/css!

    ADD: You should use <li>'s inside your <ul> and trigger the rollover on the <a> with #navigation ul li a:hover
    Last edited by vexen; 10-15-2007 at 04:34 PM.


  •  

    Posting Permissions

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