¿Cómo mantener botones, texto e imágenes relativos al tamaño de pantallas / navegadores?

Estoy creando un pequeño sitio web y soy muy nuevo en CSS, pero cada vez que cambio el tamaño de la página web en la que estoy trabajando, nada se mantiene en relación con el tamaño de la pantalla en la que se muestra. Por ejemplo, tengo el texto a la derecha, si aumento el tamaño de mi navegador al maximizar el texto a la derecha, permanece en su lugar y ahora está en el centro del navegador.

Una de las imágenes se mueve y el tamaño de la página web aumenta y disminuye al arrastrar la esquina del navegador. Utilizo el mismo código CSS para esa imagen en mi lista de hipervínculos, cuadro de texto o texto en general y no funciona en absoluto.

Investigué alto y bajo, encontré algunas cosas pero nada parece funcionar. Me siento tan frustrado, mi sitio también es local, así que ni siquiera puedo compartir el enlace. Si alguien no entiende lo que quiero decir, trataré de volver a explicar que es bastante difícil explicar el problema.

Código que funciona para la imagen:

img { padding-top:50px; display: block; margin-left: auto; margin-right: auto; } 

Además, quiero mover los hipervínculos a la esquina superior izquierda, no tenerlos asignados automáticamente si eso hace la diferencia y tampoco puedo tocar el código HTML, solo el CSS. (Estoy haciendo una prueba de CSS para ver si puedo replicar una imagen de una página web ya hecha. No estoy haciendo esto como parte de un curso o una prueba en la universidad / uni, soy estudiante pero Estoy en el puesto de trabajo como ingeniero de software, esta es una tarea a tiempo parcial para autoaprendizaje). Gracias por adelantado.

puedes usar la notación porcentual

por ejemplo :

 img { padding-top:50px; display: block; margin-left: 10%; }