Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

block-grid using article tag instead of list tags

l am trying to create a blog ground but however inside of using the unordered list as seen here http://foundation.zurb.com/docs/components/block_grid.html tags l wanted to use sum thing like article tags. this however seems not to pass any work around guy?

instead of using this

 <ul><li></li></ul>

l want to be able to use this

 <section><article><aside></aside></article></section>

1 Answer

Liam Maclachlan
Liam Maclachlan
22,805 Points

Hey man,

Have you tried custom styling on those element by targeting only elements that are direct child elements?

section > article {
/* some padding */
}

article > aside {
/* some background color */
}

the UL and LI combo is rendered automatically with default styles by the browser, it would just be a case of adding you own from there.

...I hope this is what you meant any way. lol. If not, let me know and I'll think on it a bit more :)

EDIT: If you are using a CSS framework, have a peak under the hood and change the ->>

ul[id^='small-block-grid-'] > li {
    display: inline-block;
}

to

section[id^='small-block-grid-'] > article {
    display: inline-block;
}

or something similar.

Am i closer this time? :)