Přidat otázku mezi oblíbenéZasílat nové odpovědi e-mailem CSS iframe

Zdravím, mám takový požadavek abych čtyři html stránky na kterých jsou jen obrázky z jídelníčku vložil do jedné stránky jako náhledy.
Zkusil jsem to přes iframe a udělal tabulku 2x2:

html:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Aramark</title>
<link rel="stylesheet" type="text/css" href="mojecss.css">
</head>
<body id="aramark">
<table>
	<tr>
		<td><iframe src="http://menu.aramark.cz/screens2/577/1" ></iframe></td>
		<td><iframe src="http://menu.aramark.cz/screens2/577/2"></iframe></td>
		
	</tr>	
	<tr>
		<td><iframe src="http://menu.aramark.cz/screens2/577/3"></iframe></td>
		<td><iframe src="http://menu.aramark.cz/screens2/577/4"></iframe></td>
	</tr>
</body>
</html>

CSS:

body#aramark{
	background-color: white;
	overflow: hidden;
}	

iframe {
    width: 500px;
    height: 500px;
   
}

Výsledek je že mám náhledy 2x2obrázků v iframech, problém je, že potřebuji, aby se ty náhledy prizpůsobily tomu oknu iframu. Teď vidím jen část obrázku v jednotlivých iframech.

Předmět Autor Datum
No celé bych to spravil asi kus jinak, veľkosti prvkov v iframu sa "ťažšie" "prispôsobujú", kedže ch…
Mlocik97 20.03.2018 12:32
Mlocik97
Díky za odpověď, můžu poprosit jak bych to konkrétně přizpůsobil na můj případ. Takže mám vyhodit ta…
rambic 20.03.2018 12:48
rambic
iframy vnorovať do tabulky je iba zbytočné sťaženie (ale jde to i cez tabulky, ja bych to ale tak ne…
Mlocik97 20.03.2018 13:17
Mlocik97
Zkoušel sem ten scale, ale docílím jen toho, že mi zůstane původní velké okno a v něm se mi zmenší t… poslední
rambic 21.03.2018 08:56
rambic

No celé bych to spravil asi kus jinak, veľkosti prvkov v iframu sa "ťažšie" "prispôsobujú", kedže chcete zmeniť zobrazenie prvkov ktoré nie sú na Vašej stránke... Ak už to chcete zoskladať zo 4 iframov, tak bych doporučil používať margin a padding a (viď link na stack overflow):

    -ms-transform: scale(0.25);
    -moz-transform: scale(0.25);
    -o-transform: scale(0.25);
    -webkit-transform: scale(0.25);
    transform: scale(0.25);

    -ms-transform-origin: 0 0;
    -moz-transform-origin: 0 0;
    -o-transform-origin: 0 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;

https://stackoverflow.com/questions/32490167/automatically-scale-resize-image-in-an-iframe

Zpět do poradny Odpovědět na původní otázku Nahoru