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

Posted by Anna Litynska
Anna Litynska
2,346 Points

Gallery elements move in a weird way

The gallery element with a bigger caption moves the elements below it (please check the screenshot). When I expand the window the elements get to the right position. What can I do to make it look good? Screenshot here: http://oi68.tinypic.com/fdghky.jpg

1 Answer

Dan Weru
Dan Weru
47,649 Points
Dan Weru
Dan Weru
47,649 Points

Hi anna, You could use pseudo classes to float the first image in every row left. For instance if each row has two images, you could try this ...

.gallery li:nth-child(2n+1){
   margin-left:0;
}
Matthew Smart
Matthew Smart
12,567 Points
Matthew Smart
Matthew Smart
12,567 Points

Hi Anna, could you please show your HTML and CSS?

i have seen this problem a lot with bootstrap, but im not sure how your coding it to help you :)

Anna Litynska
Anna Litynska
2,346 Points

one weru Thank you very much!

Anna Litynska
Anna Litynska
2,346 Points

Matthew Smart, here is my index.html : http://pastie.org/10782053

and here is my main.css: http://pastie.org/10782059

and responsive.css: http://pastie.org/10782063

Thanks in advance :)

Matthew Smart
Matthew Smart
12,567 Points
Matthew Smart
Matthew Smart
12,567 Points

Anna Litynska , just seen your comment, did the answer from one weru fix the problem for you?

Anna Litynska
Anna Litynska
2,346 Points

Matthew Smart, no it didn't :( nothing happens