Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

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? :)