Results 1 to 2 of 2

Thread: how to add correctly class name to particular List style?

  1. #1
    Join Date
    Jan 2006
    Posts
    126
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Question how to add correctly class name to particular List style?

    ul {list-style-type:none;}
    li {list-style-type:none;
    font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px;
    background: transparent url(myimage.gif) no-repeat 0px 1px;
    padding-bottom:2px;
    padding-left:20px;
    line-height:11px;
    }
    <ul class="link"><li><a href="mailto:mymail@website.com" >mymail@website.com</a></ul>

    1. question:
    Is there some solution that there will be not <li class="link">

    like
    <ul class="link"><li>

    But I have another li defined in css script

    2. question
    If I have in code above class with css script, it will give me space at the top and bottom.
    How to avoid this space?

    Code is like:
    PHP Code:
    <p>
    Text1<br />
    text2<br />
    text3
    <ul class="link"><li class="link"><a href="mailto:mail1@mail.com">jmail1@mail.com</a></li></ul>
    </
    p
    It seems problem because there is within tage <p> but I need to have as this is for space between text paragraph

    It gives me an error when I validated:
    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>").
    Last edited by toplisek; 05-23-2007 at 09:39 AM.

  2. #2
    Join Date
    Dec 2004
    Location
    UK
    Posts
    2,358
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Quote Originally Posted by toplisek View Post
    Is there some solution that there will be not <li class="link">
    Sorry, but that makes no sense. Could you please rephrase the question?

    If I have in code above class with css script, it will give me space at the top and bottom.
    How to avoid this space?
    Remove the margin applied to the list (ul) element. You may also need to alter the margin for other block-level elements around it, such as the paragraph.

    I start tend to style sheets with:

    Code:
    body, body * {
        font: 100%/1.2 sans-serif;
        margin: 0;
        padding: 0;
    }
    This resets the margins, padding, font styles and line-height for all elements. I can then reapply them in the way that would be most suitable.

    <p>
    <!-- ... -->
    <ul class="link"><li class="link"><a href="mailto:mail1@mail.com">jmail1@mail.com</a></li></ul>
    </p>
    This is invalid, and doesn't do what you think it does. It is, in fact, equivalent to:

    HTML Code:
    <p>
    <!-- ... -->
    </p>
    <ul class="link"><!-- ... --></ul>
    </p>
    Notice the extra end-tag before the list. Paragraphs cannot contain other block-level elements, only in-line elements. Encountering a block-level element implies the end of the paragraph. The second end-tag is obviously then invalid as there's no matching start-tag.

    It gives me an error when I validated:
    Quoting the actual error message, not the explanatory text that follows, is more useful (for me, anyway). However, a link to the document in question is better still as the cause of the error may be in a different place than you think.

    If correcting the paragraph doesn't help, please post a link.
    Mike

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
  •