image position on web-page

For general web development questions that are not specifically related to CSS HTML Validator. This includes (but is not limited to) general HTML, CSS, Accessibility, JavaScript, and SEO questions.
Post Reply
User avatar
gomezcarsonk
Rank 0 - Newcomer
Posts: 1
Joined: Tue May 11, 2021 2:22 pm

image position on web-page

Post by gomezcarsonk »

Hello everybody! I'm new to the whole business, so I have some difficulties with simple things, so please treat me with patience and understanding :)
On a web page of employee monitoring, I need to place several images that need to be scaled based on the size of the browser window.
If the window is reduced, the image should also be reduced accordingly, but adjusted to the web page so that it can be seen
I am using this code
and now I have a problem - when I move the browser window, it just falls off the page.

<p> <img style = "position: absolute; top: 10px; left: 1034px; width: 350px; height: 501px;" src = "/ image.jpg" alt = "Image" align = "right" /> </p>

Any help would be appreciated!
Thank you!
Gomez C.
Last edited by gomezcarsonk on Mon May 17, 2021 4:13 am, edited 1 time in total.
User avatar
Albert Wiersch
Site Admin
Posts: 3783
Joined: Sat Dec 11, 2004 9:23 am
Location: Near Dallas, TX
Contact:

Re: image position on web-page

Post by Albert Wiersch »

Hello,

You may want to try using percentages for lengths instead of absolute length values like 350px.

You might also find the CSS clamp() function handy, which lets you set a minimum, preferred, and maximum size (or length).
https://developer.mozilla.org/en-US/doc ... SS/clamp()
Albert Wiersch, CSS HTML Validator Developer • Download CSS HTML Validator FREE Trial
Post Reply