Centrer une image à la base d'un futur site

**stonda** · 28/06/2019, 14h21

Bonjour
Je suis totalement néophite, sans connaissance réelle en html. J'ai acheté un hébergement dans lequel je mettrai un site vitrine avec WordPress (qui sera fait par un pro). En attendant je souhaite mettre une image à la base du site (www) pour que la zone ne reste pas vide. J'ai créé une image (1305 * 791), et un petit code html, souvenir résurgence de souvenirs lointains.
http://www.agencetpk.com/
Ca fonctionne bien sur pad, téléphone et sur mon ordi portable. (écran 1360 px)
Mais l'image est calée à gauche quand j'ouvre le lien sur une machine avec un écran de 1500, 1900 px et plus.
Ce qui est logique !
Mais je ne vois pas comment, en faisant le plus simple possible je peux centrer l'image. Je pensais avoir centré la table, puis l'image dans la table. Cf code ci-dessous.
J'ai modifié le code, en augmentant la largeur de la table à 1900, sans être convaincu que ça règle le problème, il me semble que sous Firefox ça reste aligné à gauche (pas grave) et sous chrome c'est probablement aligné :

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

<table width="1900" height="791" align="center">

Si quelqu'un a une solution facile ?
Merci par avance

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
<html>
	<head>
		<title>Agence TPK. St Malo</title>
	</head>
	<body >
		<table width="1305" height="791" align="center">
			<tr>
				<div>
                	<p align="center"><img src="./tpk.jpg" alt="Agence TPK. St Malo"width="1305" height="791" align="middle" title="Agence TPK. St Malo"></p>
        		</div> 
			</tr>
		</table>
	</body>
</html>

**NoSmoking** · 28/06/2019, 15h16

Bonjour,
oui ... !!! mais ... !!!
un code minimum qui fera quoiqu'il arrive mieux que ce tu as mis

Code html :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<!DOCTYPE html>
<html>
<head>
<title>Agence TPK. St Malo</title>
<style>
img {
  display: block;
  margin: auto;
  max-width: 100%;  /* pas forcément obligatoire */
}
</style>
</head>
<body >
<img src="./tpk.jpg" alt="Agence TPK. St Malo">
</body>
</html>

**stonda** · 28/06/2019, 15h54

Là je reste sans voix !
Chapeau, ça me semble parfait (aussi parfait que possible en tous cas)
Et tellement plus simple que mon code du siècle dernier !
Merci, c'est très sympa

**NoSmoking** · 28/06/2019, 16h31

ça me semble parfait ...

euh ! non quand même pas ...

que mon code du siècle dernier !

Je confirme

**Sodium** · 29/06/2019, 09h58

Ca aurait tout de même été plus simple de la mettre en background.

**Dave Hiock** · 30/06/2019, 18h11

Plus simple, peut-être, mais déjà qu'il n'y a pas grand chose dans la page sur ce coup il n'y aurait plus rien ni image ni texte alternatif.
A la limite faire une galerie simple avec les images qui ont permis de réaliser la grande image.

Centrer une image à la base d'un futur site

Centrer un élément en CSS

Discussions similaires

Partager

Partager