Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Annoying little validation bug

  • This topic is empty.
Viewing 5 posts - 1 through 5 (of 5 total)
  • Author
    Posts
  • #27339
    mshort
    Member

    Hey everyone,

    So my problem is starting to really frustrate me. I did this nav bar, with 2 lines of text inside each <li> I’m not so good at explaining it but if you see the code i’ve linked below you will see what i mean.

    Anyway so the way I’ve done it works fine in the browser, doesnt have any display issues in either safari or firefox, (haven’t checked ie yet) but the validator says

    Quote:
    The mentioned element is not allowed to appear in the context in which you’ve placed it; the other mentioned elements are the only ones that are both allowed there and can contain the element mentioned. This might mean that you need a containing element, or possibly that you’ve forgotten to close a previous element.

    One possible cause for this message is that you have attempted to put a block-level element (such as "<p>" or "<table>") inside an inline element (such as "<a>", "<span>", or "<font>").

    Here is the code

    #68731
    TheDoc
    Member

    If I remember correctly, you cannot have a <p> inside a <li>.

    #68798
    luxurychair
    Member

    <a> is an inline element and <div> is a block element. You can’t put the <div> (or the <p>, for that matter) inside the <a> tag.

    You can do it this way though.

    Code:
    • text or whatever here

    with the css:

    Code:
    a.block_link{
    display:block;
    width:100%;
    height:100%;
    }
    #68799
    mshort
    Member

    Thanks for that. and even though the <a> element isn’t around the other elements they will all be clickable as the link?

    #68800
    luxurychair
    Member

    Yeah, so long as its height and width are set appropriately – it’ll expand and fill the area. You _should_ be able to do that with height:100% width:100%, but if not you can manually set them using px numbers and absolute positioning.

Viewing 5 posts - 1 through 5 (of 5 total)
  • The forum ‘CSS’ is closed to new topics and replies.