How to text logo box stuff

How to text logo box stuff
0.0 0

#1

Hi there,

I want to create a main image, and in the upper left corner to put a 0.5 opacity gray box with logo and
a text, Right now I only succeeded to put an image and the logo and text with no background box…

How can I do it?

My pen: https://codepen.io/nadav-himmelfarb/pen/BxwEPz

Thanks for who ever answer me :slight_smile:


#2

Hello there,

I know someone will provide a better answer, but this might well get you heading in the right direction. I replaced your .text-block with the following:

.text-block {
display: flex;
align-items: center;
position: absolute;
top: 0;
left: 0;
background-color: rgba(26,26,26,.5);
width: 700px;
height: 350px;
}

Let me know if this helps at all. And good luck!


#3

Thank you very much I’ll check it soon and let you know,
In a meanwhile, I thought about flex and grid, didn’t tried it yet mainly because to make my life hard by tring to figure it out to better understand css… so why you choosed flex over tge old why and over grid?


#4

I used flex only because I’ve some familiarity with it (read: almost none at all). I’m still very much new at this myself.


#5

Ah cool, So best luck too :slight_smile: