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 6 of 6
  1. #1
    New Coder
    Join Date
    May 2010
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Move text "with" background image

    Hi!
    Trying this again and hoping someone can help! THANKS IN ADVANCE!!!!

    I've created this site:
    http://aftergoodesq.com/

    The problem I'm having is that on bigger monitors, the text and nav move "off" the background image and onto the grey background:
    http://clip2net.com/page/m0/5763090

    Changing the body positioning messes it up for smaller monitors:
    http://clip2net.com/page/m0/5798687

    Any ideas if I can "connect" the text and nav to the background image without actually making them all into one image?

    this is really driving me nuts so THANK YOU FOR ANY HELP!!!!!!!!!

  • #2
    Regular Coder mbaker's Avatar
    Join Date
    Jan 2010
    Location
    Burford, Oxfordshire, United Kingdom
    Posts
    249
    Thanks
    1
    Thanked 39 Times in 39 Posts
    I or others here will be more likely to look at your code and provide advice if it validates at the w3c html and css validators (see links in my sig).

    Your html has 73 errors when validated as XHTML1.0 Strict
    However if you were to change the DocType to:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" 
    "http://www.w3.org/TR/html4/loose.dtd">
    this would be reduced to 14 errors.

    There are also 3 errors in your CSS.

    In CSS (& HTML) the colour grey is spelt gray, just as colour is spelt color.
    - Michael Baker - HTML Tags Guide - Reference and Tutorials
    - Like voting, validate early, validate often - W3C HTML Validator - W3C CSS Validator
    - Wot? me cynical? no, its just if you vote, er, validate early, you have more chance of validating often.

  • #3
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Posts
    3,215
    Thanks
    16
    Thanked 265 Times in 263 Posts
    Not that you should change to HTML 4.01 Transitional. If you validate to this standard, there's no point in doing so at all. HTML 4.01 Strict or XHTML 1.0 Strict are recommended for new documents.

    I assume you don't know how to center in CSS? One uses "margin: 0 auto" (only margin-left and margin-right have to be auto, top and bottom can be anything you want.) Apply this to a container around the rest of your content and the rest should be easy.

  • #4
    Regular Coder mbaker's Avatar
    Join Date
    Jan 2010
    Location
    Burford, Oxfordshire, United Kingdom
    Posts
    249
    Thanks
    1
    Thanked 39 Times in 39 Posts
    For me the value in validating against any standard, including HTML4.01 Transitional, is that it removes a major cause of things not working the way you want or expect them to.

    If it does not validate it suggests there is a major flaw in your code, such as the second <body> tag and the stray closing </div> tags for which there are no opening tags. Is this because the </div> tags are extra, or some opening <div> tags are missing?

    If you want to go with the future you could validate against HTML5 using the experimental validator. There are only 26 errors with HTML5 compared to 73 with XHTML 1.0 Strict.
    - Michael Baker - HTML Tags Guide - Reference and Tutorials
    - Like voting, validate early, validate often - W3C HTML Validator - W3C CSS Validator
    - Wot? me cynical? no, its just if you vote, er, validate early, you have more chance of validating often.

  • #5
    New Coder
    Join Date
    May 2010
    Posts
    12
    Thanks
    0
    Thanked 0 Times in 0 Posts
    thank you very very much Apostropartheid.
    i tried what you suggested, putting the elements in a container with "margin: 0 auto", and this was the result:
    http://clip2net.com/page/m0/5865080
    do you have any suggestions? is there something else that i should be doing with this container?

    mbaker, thanks for the feedback too. i would like to get everything squared away but getting the layout correct is a higher priority as this is something that many users may see. i know i'm sort of doing it backwards, but that's just where i'm at right now.

  • #6
    Regular Coder mbaker's Avatar
    Join Date
    Jan 2010
    Location
    Burford, Oxfordshire, United Kingdom
    Posts
    249
    Thanks
    1
    Thanked 39 Times in 39 Posts
    Quote Originally Posted by hyperballad400 View Post
    mbaker, thanks for the feedback too. i would like to get everything squared away but getting the layout correct is a higher priority as this is something that many users may see. i know i'm sort of doing it backwards, but that's just where i'm at right now.
    My suggestion that you get you page to validate (to any standard) is not to do it because you should, or because it is a good thing to do, but to assist you in getting your layout correct. For example major flaws in your code, such as the second <body> tag and the stray closing </div> tags for which there are no opening tags could well be the cause of your problems.

    When browsers encounter errors such as these they "guess" at what you intended. Different browsers make different "guesses" leading to different layout.

    Frankly, until you eliminate these issues, it is fairly pointless looking for other solutions.
    Last edited by mbaker; 05-19-2010 at 08:27 AM.
    - Michael Baker - HTML Tags Guide - Reference and Tutorials
    - Like voting, validate early, validate often - W3C HTML Validator - W3C CSS Validator
    - Wot? me cynical? no, its just if you vote, er, validate early, you have more chance of validating often.


  •  

    Posting Permissions

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