HTML & CSS
I'm working on a template that has a sidebar breadcrumb navigation, which is an unordered list. The <ul> is automatically assigned an ID (#breadcrumb) and the css has a fixed height for this ID. This <ul> is not in its own div.
Is it possible to not have a fixed height for the <ul> tag, but instead have the height automatically expand as more content is added to the list? Or is the only way to do this is to wrap the <ul> in a div?
The best plan is just not to set a height on #breadcrumb, and it will automatically take up whatever size it needs to fit the contents. There's no need to worry about whether it's in a <div> or not – you can apply pretty much the same CSS to any block elements as you can to a <div>.
I've tried that, removing the height from the css and it just collapses behind the <ul> "content". I forgot to mention that the #breadcrumb has a background color, so it's easy to see that the height collapses and the height doesn't expand to fit the content.
Are the <li>s inside the <ul> floated? If so, add
overflow:hidden; to #breadcrumb.
Failing that, if you give us a link to the page then we can see what is really going on!
Thank you Stevie!
This topic is now closed. New replies are no longer allowed.