#1
  1. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2011
    Posts
    5
    Rep Power
    0

    Css menu problem, please help!


    Hi there

    i have a small problem and i think it lies in my nav menu, basically i want my menu to float right which it does but i'm left with this large white area on the right side of my webpage.

    please could someone take a look and help me

    my website being webbid.co.uk

    and the code :-
    Code:
    ul.dropdown,
    ul.dropdown li,
    ul.dropdown ul {
     list-style: none;
     margin: 0;
     padding: 0;
    }
    
    ul#nav {
     float: right;
     position: relative;
     z-index: 597;
    }
    
    ul.dropdown li {
     float: right;
     line-height: 1.3em;
     vertical-align: middle;
     zoom: 1;
    }
    
    ul.dropdown li.hover,
    ul.dropdown li:hover {
     position: relative;
     z-index: 598;
     cursor: default;
    }
    
    ul.dropdown ul {
     visibility: hidden;
     position: absolute;
     top: 100%;
     left: 0;
     z-index: 599;
     width: 100%;
    }
    
    ul.dropdown ul li {
     float: none;
    }
    
    ul.dropdown ul ul {
     top: 1px;
     left: 100%;
    }
    
    ul.dropdown li:hover > ul {
     visibility: visible;
    }
    Thanks in advance.
    Last edited by Kravvitz; February 9th, 2011 at 04:54 PM. Reason: added [code] tags
  2. #2
  3. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Welcome to DevShed Forums, just99.

    It's because of the "right:0" in the "ul.dropdown ul" rule in "default.css".

    Three different stylesheets seem to be in use just for the menu. I strongly recommend you merge them for reasons of faster page loading and easier maintenance.

    Are you aware that your page contains XHTML errors?
    http://validator.w3.org/

    As you found out new users are restricted from posting URLs until they have made 5 posts. You may need to get around this by leaving out the "http://" and putting a space before each ".". Yes this rule is annoying, but the administrators say it's necessary for limiting spam.

    P.S. It would be helpful if you put your code between [code][/code] tags in the future. I added them for you this time.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  4. #3
  5. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2011
    Posts
    5
    Rep Power
    0
    Hi kravvitz

    Thanks for the quick reply and thankyou for solving my problem.

    also thanks for letting me know forum rules i am not really aware of them and will take them into account next time.

    i will merge my style sheets into one style sheet and as for the validation errors, i did have 136 errors 36 warnings and now down to 80 errors 0 warnings so i am working on them. Will i have to fix all errors or is it ok to have a few?

    Thanks again.
  6. #4
  7. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    You're welcome.

    i did have 136 errors 36 warnings and now down to 80 errors 0 warnings so i am working on them. Will i have to fix all errors or is it ok to have a few?
    Yes, it's worth fixing all of the errors in your page. You're not using any of the elements or attributes that are good to use even though they don't validate as XHTML 1.0.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  8. #5
  9. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2011
    Posts
    5
    Rep Power
    0
    sorry for long reply, about the errors, is it possible to fix all errors because i had a look at some bigger well known websites for example facebook had 40+ errors, i mean some of the errors on my site i have no idea how to fix them for example these errors shown below, the errors are the ones in red, i'm just after a little advice.

    …tp:/mysite/template/GreenAndBlack/img/footerlogo.png" align=right />

    </div>

    You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".

    Thank
    Justin
    Last edited by just99; February 10th, 2011 at 01:54 PM. Reason: solved one error
  10. #6
  11. CSS & JS/DOM Adept
    Devshed Supreme Being (6500+ posts)

    Join Date
    Jul 2004
    Location
    USA (verifiably)
    Posts
    20,124
    Rep Power
    4309
    Yeah, some of the error messages can be rather cryptic. (Some times I offer to explain the error messages and other times I forget.)

    The language attribute of the <script> element is deprecated, so don't use it. Just use the type attribute.

    The alt attribute is required on images. These explain how to use it correctly.
    http://webaim.org/techniques/alttext/
    http://www.456bereastreet.com/archiv...le_attributes/
    http://www.456bereastreet.com/archiv...good_alt_text/

    In XHTML attribute values must be quoted.
    Code:
    …tp:/mysite/template/GreenAndBlack/img/footerlogo.png" align="right" />
    However, in the case of the "align" attribute, it is much better to use a class and CSS instead.
    Code:
    …tp:/mysite/template/GreenAndBlack/img/footerlogo.png" class="footerLogo" />
    You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".
    This means that elements that are empty by definition (for example <meta>, <link>, <img>, and <input>) must be specially closed. You do that by adding a " /" before the ">" of the start tag. So this regular HTML
    Code:
    <img src="example.png" alt="">
    becomes this in XHTML:
    Code:
    <img src="example.png" alt="" />
    Originally Posted by Markup Validator
    end tag for "a" omitted, but OMITTAG NO was specified
    …"><a href="http://www.webbid.co.uk/friends.php">Become a friend @ Webbid</span
    This error is because tags need to be closed in the correct order. The only start tag that is shown is an <a> but the first end tag that is found is the </span>, since a <span> start tag was not found after the <a>, an </a> end tag must come before the </span> end tag.

    Hopefully that will help you make some progress. To fix some of the errors about <table>, <td> and <div> elements, you could try using Tidy UI.
    Spreading knowledge, one newbie at a time.

    Learn CSS. | PHP includes | HTML Validator | CSS validator

    Remember people spend most of their time on other people's sites (so don't violate web design conventions).
  12. #7
  13. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2011
    Posts
    5
    Rep Power
    0
    Thank you very much, your explanations are so much clearer i can sort of understand now most of the errors, maybe you should code the Validation Output for W3C you would certainly help a lot more people get round their errors.

    Thanks again for your help

    p.s does this forum allow members to give members/admin points of some sort for their help, you've helped me a lot i would like to return the favour somehow.
  14. #8
  15. No Profile Picture
    Registered User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Feb 2011
    Posts
    5
    Rep Power
    0
    Hi again, just wanted to post 1 last message and let you know kravvitz that i have fixed all of my errors thanks to your help and advice, really appreciate it.

    Thanks again
    Justin

IMN logo majestic logo threadwatch logo seochat tools logo