[dennisr1998]

Hi everyone!

I am a beginner with HTML and CSS and would like some help.

I want to build a website with an image as a background. There is also a logo with text on it. I also want to add text here.

Everything has been successful so far, only if I make the browser screen smaller, part of the image disappears and the text moves. It no longer looks nice and good.

How can I make this work properly for each screen format?

Would someone give me the code or a template where I just have to add the text and the image link?
The image resolution is 2339 x 1654

Thanks in advance!

[dennisr1998]

The image resolution is 2339 x 1654

[Paulie_D]

A demo in Codepen.io would be useful.

[dennisr1998]

Here you can see my code:
https://codepen.io/dennisr1998/pen/YoNqxo

This is without the background picture and text. Because this is private text sorry.

[dennisr1998]

I want to pin the text on the background photo.
I also want the photo and text to scale together. Even if another device is used, for example.
The text can only be placed nicely in one place in the photo.

[Paulie_D]

You can use any image and any text if you have privacy concerns.

Withouta proper demonstration your code is of little help.

[dennisr1998]

https://codepen.io/dennisr1998/pen/YoNqxo

I have used a random background image from Google.
I want one page with the background photo and text over the photo. Without moving the text at a different resolution.
I would like the photo and the text to adjust to the screen without the text appearing anywhere else on the photo.

I also want the entire photo to be visible without scrolling or something.

Is my wish possible?
And do i need another picture resolution?

If I open the page with this code and adjust the resolution, the background image will adjust. Unfortunately, the text does not go with it. So I want that fixed.

I dont use a CMS. I build it in notepad++

[Author]

Posts