.HTML5 alternative pour les cadres avec 1 fixe (menu) colonne

En ce moment je suis en utilisant des cadres sur mon site Web pour obtenir un menu avec 256px images larges sur la leftsite de l'écran:.HTML5 alternative pour les cadres avec 1 fixe (menu) colonne

<frameset cols="275,*"> 
    <frame src="Menu.html" name="menu" title="menu" marginwidth="0" noresize> 
    <frame src="MSX.html" name="game" title="game" marginwidth="0">

Site: http://www.file-hunter.com/MSX

J'ai regardé des iframes qui sont html5 conformes, mais cela donnera toujours les problèmes de bookmarking standard. En outre, cela ne permettra pas à l'émulateur de passer en plein écran.

J'ai également regardé des colonnes, mais je ne peux pas trouver un moyen de donner à la première colonne une largeur fixe en quelque sorte. Je ne me dérange pas besoin de mettre à jour tous les 170 dossiers .html, mais je serais vraiment intéressé à trouver une solution qui me donnera la même disposition & fonctionnalité dans .HTML5 décent et être en mesure de faire fonctionner l'émulateur complet Écran.

Source

2017-09-14 A de Klerk

En attendant, j'ai aussi posé cette question ailleurs et j'ai trouvé une bonne solution en utilisant CSS Grids.

CSS:

* 
.sidebar { 
    grid-area: sidebar; 
} 

.content { 
    grid-area: content; 
} 

.header { 
    grid-area: header; 
} 


.wrapper { 
    display: grid; 
grid-gap: 1px; 
    grid-template-columns: 258px 1fr 1fr; 
    grid-template-areas: 
      "....... header header" 
      "sidebar content content"; 
    background-color: #fff; 
    color: #444; 
} 
.box1 { 
background-color: #000; 
color: #fff; 
border-radius: 5px; 
padding: 1px; 
font-size: 150%; 
} 

.box2 { 
background-color: #fff; 
color: #000; 
border-radius: 5px; 
padding: 1px; 
font-size: 100%; 
} 
.header { 
background-color: #999; 
}

HTML:

<body> 
<section class="wrapper"> 
<div class="box1 sidebar"> 
A bunch of pictures with links 
</div> 
<div class="box2 content"> 
Emulator with content 
</div> 
</section></body>

Je dois encore jouer avec l'en-tête et pied de page un peu, mais cela semble fonctionner assez bien.

Source

2017-09-14 18:26:01

.HTML5 alternative pour les cadres avec 1 fixe (menu) colonne

Répondre

Questions connexes