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 5 of 5
  1. #1
    Regular Coder
    Join Date
    Apr 2006
    Location
    Northbrook, IL
    Posts
    394
    Thanks
    8
    Thanked 6 Times in 6 Posts

    Question expanding inline element?

    is there any way to make an inline or inline-block element "expand" to fill the remaining width on the same line?

    the behavior can be achieved quite easily with a table row and cell; in fact, this is the default behavior.

    i've been working with css layouts for years and this has to be the single most annoying problem other than (the similar) non-expanding heights (equal height columns) and of course IE*

    always run into a need for this when creating horizontal ul/li nav menus with a dynamic amount of buttons that need to all fit into the fixed width of the ul. i'm always having to write backend code that counts the buttons and barfs out the needed css width percentage for the li's.

    thanks,
    Leon
    Last edited by Leeoniya; 11-08-2010 at 01:45 AM.
    "I only know that I know nothing."
    -Socrates

  • #2
    Senior Coder
    Join Date
    Sep 2010
    Posts
    1,899
    Thanks
    15
    Thanked 226 Times in 226 Posts
    The magic words are: display:block;
    Works with most inline elements.

  • #3
    Regular Coder
    Join Date
    Oct 2010
    Location
    Florence, MS
    Posts
    484
    Thanks
    10
    Thanked 33 Times in 32 Posts
    Beat me to it DrDOS XD lol

  • #4
    Regular Coder
    Join Date
    Apr 2006
    Location
    Northbrook, IL
    Posts
    394
    Thanks
    8
    Thanked 6 Times in 6 Posts
    block level elements fill their own entire line. they do not fill the rest of the current line.
    "I only know that I know nothing."
    -Socrates

  • #5
    Senior Coder
    Join Date
    Sep 2010
    Posts
    1,899
    Thanks
    15
    Thanked 226 Times in 226 Posts
    Upon re-reading I see what you want. The word "expand" threw me off, you want them to share the space on the line.

    http://www.pageresource.com/dhtml/cs...ist_properties

    Look at the item 'display' to see some of the table like properties than can be applied. I've never tried applying them to ul or li, and have no idea how good browser support will be for them.


  •  

    Posting Permissions

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