been experimenting with unordered list UL and i have seem varios examples of using them in place of divs..
So i a bit confused, when should i use divs and ul..
for example if i have a 3 column layout then i presume i used divs here, although i can use UL
Also on the right column i have lots of formatting to do, the idea was to place divs with divs with in divs …
can anyone point out when to use one over the other and are there any browser compatibility issues?
I have seen some sites say that ULs are cleaner than divs, but is this the case?
and also people stating you can build a complete layout with ULs and LIs but you would never do it – why?
I think you see where i am going with this, i am just confused about when to use one over the other.
One example is that in my 3rd column (right) – its a div but inside i need to put a rounded BOX so i was think of putting more divs inside this with corner images?
Any help would be really appreciated
UL stands for unordered list. Use it for lists of items where order is irrelevant.
DIV stands for division. Use it to group items.
ULs are cleaner than divs—IF you’re doing a list. A menu is mostly a list of links. A gallery has a list of images. A forum has a list of messages, and a list of users.
RE: rounded corners: There’s HTML, and there’s more semantical HTML. You could use
<div>for anything, and you’d hardly note a difference, but using the proper elements will make it easier to understand (both by you when putting the design together, by screen-scrapers trying to find the proper item in the page, and sufficiently-smart search engines identifying fragments of content and navigation elements).So, in order to do rounded corners, you should consider wether a corner deserves its own content-free div (which, sadly, due to today’s rendering engines, it does), or if you can use a better solution (ie, if the sidebar is a fixed size, you can get by with a single background; if you need it to expand in one dimension, you can use two: a top-aligned ceiling, and a bottom-aligned floor on its own “mobile” div (theorically you could avoid the extra div by modifying the bottom element of the div)).