Header does not display correctly

Hello, good morning everyone. I have a problem with formatting my header. It doesn’t want to correctly display the image that I put when the cell phone is vertical, it only displays correctly. When it’s vertical. bichodemontanha.shop this is the website And this is the source code used.

body { margin: 0; padding: 0; font-family: Arial, sans-serif; font-size: 16px; color: #fff; background-color: #000; } header { height: 40vw; width: 80vw; background: url('imagem/cab.png') no-repeat center center fixed; background-size: cover; align-items: center; padding: 2vw; } .logo img { height: 39vw; width: 39vw; } .header-title { text-align: right; font-size: 3.6vw; font-weight: bold; margin: 0; }

Could someone help me to correct it so that it is displayed correctly both with the device vertically and horizontally. Thank you in advance for dedicating part of your time to help me. Very Thank you and may God enlighten your steps.

First reduce that logo

and then for this text instead of RIGHT put LEFT


because the current size of the logo pushes the text
and it’s even worse that you put it on the right and then it looks like this

3 Likes

I assume that you wanted to have the logo and text in the same line
but for such a thing in general it is better to use mobile-ready ( responsive web design) code
and not this simple code that your website currently uses.

Also remember to clear the browser cache to see the changes

2 Likes

I made the changes and it didn’t work.I don’t know anything I’m using the simple codes because I’m a layman.I’m just a Brazilian tour guide. that I am trying to increase my financial income. and the site can provide me with a greater return. but I’m a layman in programming, I’m just an expert in climbing.I already come to thank you for your help.

horiz


Please clear the browser cache
If that doesn’t help (because some browsers are stubborn) then follow these instructions

https://tinkertechlab.com/webhosting/security/how-to-clear-your-browsers-cache

5 Likes

so it is displayed to me but I want to leave the top image the same as the bottom.

If you don’t know HTML, you can try adding one of the free subdomains in acc
and try this site builder on it

and simply choose one of the templates which are also responsive
and if you are satisfied with it and it is easier for you, you can later generate it on the official page (domain)


That way it will be faster and simpler
instead of editing codes and sizes for each image as before
and even if it looks good on your device, it won’t on someone else’s

or consider installing WordPress via the Softaculous app installer from the Control Panel (once the CP issue is resolved)

3 Likes

I don’t have a computer, only a cell phone, so I can’t drag the images into the site.I have WordPress already installed but I don’t know how to export the site because the images are on their server

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