Ask Your Question
0

Anakin 2.0 - black boxes

asked 2020-04-29 15:22:15 -0500

Zsemby gravatar image

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 flag offensive close merge delete

Comments

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...)

David.Zarathustra gravatar imageDavid.Zarathustra ( 2020-05-09 01:16:56 -0500 )edit

2 answers

Sort by » oldest newest most voted
0

answered 2020-04-29 16:18:58 -0500

aze gravatar image

updated 2020-05-01 10:31:53 -0500

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

edit flag offensive delete link more
0

answered 2020-04-29 17:53:05 -0500

Zsemby gravatar image

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

edit flag offensive delete link more

Comments

Updated my answer :)

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

Your Answer

Please start posting anonymously - your entry will be published after you log in or create a new account.

Add Answer

Question Tools

1 follower

Stats

Asked: 2020-04-29 15:22:15 -0500

Seen: 55 times

Last updated: May 01