Um objeto por padrão é alinhado a esquerda da tela. Gostaria de saber como alinho uma imagem na direita da tela, de forma que quando eu altero o tamanho da janela a imagem permaneça "encostada" no canto direito da tela, sem ser cortada, segue abaixo meu andamento com o código, o emoji esta a direita da tela, porém quando eu diminuo a largura da janela do navegador o emoji fica la e fica oculto. O que eu estou tentando fazer é que a posicao dele seja corrigida automaticamente para que ele sempre fique encostado no canto direito da janela, o que ocorre naturalmente no canto esquerdo da janela.
Código:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Posicionar um objeto na tela_2</title>
<style type="text/css">
#imgpos {
position:absolute;
left:100%;
top:50%;
}
</style>
</head>
<body>
<p>Para retornar ao tutorial use o botão "Voltar" do seu navegador.</p>
<img src="https://criemoda.files.wordpress.com/2012/08/sorriso.png" width="220" height="220" alt="logo maujor" id="imgpos">
</body>
</html>
Antecipadamente agradeço quem ler e puder responder!