Working with images and text

HTML-CSS
1

I have no idea why, but I hate working with images. There is just something about them that I can not stand. I am follow this challenge

And here is my pen

I am not trying to follow this challenge exactly. I am more of using it as a guide to set up a page for my brother in law restaurant. Eventually, I will change the colors, images, and text but I wanted to at least get something going to.

Anyway, I am having two problems right now.
1). I am trying to change the width of the text on the right side of the image. that way the “Enjoyable place for all the family” text is not all one one line, but half on one line and the other half beneath it. However, anytime I mess with the width the text goes right back under the image

2). You can see the second image over laps the first image a little bit. I was wondering what the best way to approach that would be? I read somewhere that using css grid would be the best. Would that be correct?

EDIT: I figured out the first question using

overflow: hidden;

If anyone has the best approach for my second question I would appreciate it

2

There are 0px between the countryside img and the one above it. They aren’t overlapping. Since both images are in separate divs they naturally stack vertically.

3

I edited your project… :blush: How it looks now?

Restaurants

4

Oh wait, now I get it. You want the photos to overlap. Use the position property then using the z-index you can make one overlap relative to the other.

5

Yes, but I mean they should be aligned because they are not so understandable

br means new paragraph
&nbsp means space

but I think you knew so… I’m not so helpful…

6

Than you for the suggestions and help. This is what I have working right now

will change the font stuff a little later

7

Now it looks better. You can add a frame too

8

Now you need to do a form for the menu or for the “book a table”…

9

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.