Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 8 of 8
  1. #1
    Junior Member
    Join Date
    Oct 2010
    Posts
    4
    Member #
    23971
    Hello everyone,

    While working on a project i encountered a problem, i need to place <div> tags inside a <li> item, like so:

    HTML Code:
    <ul>
    <li><a><div>Text here</div></a></li>
    <li><a><div>Text here</div></a></li>
    <li><a><div>Text here</div></a></li>
    </ul>
    It needs to be a horizontal list because i have to assign a css-background to it, now the thing is that when i put div-tags inside those li-tags the list goes from horizontal to vertical.

    Any solution?

    Thanks

  2.  

  3. #2
    Junior Member
    Join Date
    Sep 2010
    Posts
    29
    Member #
    23948
    Uhm...you're placing it inside a link, that's inside a list? Why in the world? that makes no sense at all. What are you trying to achieve? Can probably be done is some other way.

  4. #3
    Junior Member
    Join Date
    Oct 2010
    Posts
    4
    Member #
    23971
    Its like a horizontal list of 4 buttons, whose background needs to change when clicked and when clicked again, changed back. So a toggle.

    The only way i know to do this is with Jquery toggleClass but as you say there must be a better way?

  5. #4
    Junior Member
    Join Date
    Sep 2010
    Posts
    29
    Member #
    23948
    Ok, so you assign a background image to the div, and want to toggle between two different div classes, is that it? The <a> is just to get the "finger cursor"?

  6. #5
    Junior Member
    Join Date
    Oct 2010
    Posts
    4
    Member #
    23971
    Well yes, of course it needs to react when clicked but i can work that out without the <a> element.

  7. #6
    Member
    Join Date
    Oct 2010
    Location
    Tampa, FL
    Posts
    42
    Member #
    23974
    Liked
    3 times
    You aren't supposed to place <div> tags inside <li> tags. I'm not really sure I understand what you're trying to do. Could you upload an image? That might help.

  8. #7
    etm
    etm is offline
    Member
    Join Date
    Aug 2010
    Location
    Calgary, Canada
    Posts
    76
    Member #
    23011
    Divs are block level elements and should not be used as you propose. However, if you are going to do so, then you need to make sure the divs within the list are set to "display:inline;".

    That said, I don't see why you can't create classes for your li elements themselves, rather than put divs in there.

  9. #8
    Junior Member
    Join Date
    Oct 2010
    Posts
    4
    Member #
    23971
    I think ive got it figured out now:

    to assign a background to an element you have to use display: block;
    to put elements in a horizontal list you have you use display: inline;

    The only way you can still make the display: block; horizontal is to use, and here it comes, float: left;

    I cant believe i was too stupid to think of that.

    Thanks everybody.


Remove Ads

Posting Permissions

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

Search tags for this page

horizontal list inside div

Click on a term to search for related topics.
All times are GMT -6. The time now is 02:10 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com