# Anakin 2.0 - black boxes

hi,

I'm almost ready with the task but I'm stucked whith the black boxes with the quotes. I made a visible white border to see the borders, and tried to get rid of the black stuff which now goes down with the other paragraphs on the other side. What did I do wrong? How can I make the unnecessary black part disappear?

Do you have any othe suggetion for improvements?

here is my pen: https://codepen.io/zsemby/pen/KKdmOBK

Thanx. Zita

edit retag close merge delete

The result looks really nice in my opinion. I checked couple of 2.0 works here, and your seems to be the best (I can't talk about coding, just the final impression (in terms of graphic design lets say - but it d need couple of changes: Anakin header is over his face, some text can't be read...)

( 2020-05-09 01:16:56 -0500 )edit

Sort by » oldest newest most voted

You've made your life a little hard with using an h1 in the blockquotes :)

If you put the background on the h1-s (where you have the border) they'll work as they supposed to. But then your quote mark will disappear, since that's before the h1 so the h1 will be on top of it.

And the bq looks like this because the .container is a flex row. By default on the cross axis is going to stretch the items (so in this case their height). So the blockqoute will be as tall as the text part next to it. You can change that easily by setting the align-items: flex-start; to the container :)

EDIT: Just simply use <blockquote>Some quote...</blockquote> :)

more

Thank you for your answer. What type of text should I use for blockquotes then?

I'll try the secod part. Hopeully it will work. Not all the features are clear yet, I'm just trying things...:-)

more

( 2020-05-01 10:31:13 -0500 )edit