Jim Gay wrote:
> When in doubt, use wacky background colors.
> Depending on your design, red, lime, yellow, and blue are quick  
> keywords that clearly alter the view without altering the layout (like  
> adding borders does). You could try floating the list items left (and  
> set the ul to overflow: hidden so that it expands to contain the  
> floated items)
>
> I'd argue that this isn't really tabular data, or at least that you  
> don't intend to display it as such since each new row doesn't  
> represent a new group, but a continuation of the previous one.  
> Unordered list makes more sense to me.
>
> Having said all that, I'm not sure how to achieve the table layout you  
> want with radius tags. Sorry to be of no help there.
>
> On Jan 21, 2008, at 11:05 PM, Ryan Heneise wrote:
>
>   
I agree with Jim.  Though I'm not such a purist that says you can never 
use a table for layout -- I just think a table is more trouble than it's 
worth here and not a good structural match anyway.

As to using tables with Radiant, I don't understand your question.  
Using tables is like using any other markup with Radiant.  You can.  Or 
were you trying to automatically create this page from a db somehow with 
your own custom tags?

Anyway, this is more of a CSS/Markup question than a Radiant one.  I'll 
offer my thoughts, but if you want to discuss more, email me off the list.

My suggestion...
So, I'd stay off of the tabular bit and keep your unordered lists.  You 
can probably find a way to use inline-block but FireFox still doesn't 
support it (though it does offer: -moz-inline-block which is similar).  
The quick solution is to return to the float: left (that is see you have 
commented out).  The problem is that you need to clear every 4th item so 
that it fully wraps to the left and creates a new line (I might use 
something like <li class="newRow">.  Then change your CSS:
    ul#staff li {
        float: left;
        width: 155px;
        margin: 0 10px 18px 0;
        vertical-align: top;
        list-style: none none inside; <-- added this (display: block 
will accomplish this in many browsers too).
    }
    ul#staff li.newRow {
        clear: left;
    }

I realize that this isn't ideal since you're adding some style-info into 
markup but, hey you were considering tables -- and that's pure style 
embedded intermingled with markup -- so I figure this solution would be 
acceptable.

Disclaimer: This might need some tweaking across browsers but probably 
not much if any.  Works just fine in FF (don't have time to test in all 
browsers right now).

By the way, some of your email addresses are too long and extend over 
into the next column.

Hope that helps,
-Chris
_______________________________________________
Radiant mailing list
Post:   Radiant@lists.radiantcms.org
Search: http://radiantcms.org/mailing-list/search/
Site:   http://lists.radiantcms.org/mailman/listinfo/radiant

Reply via email to