git/web_workshop

improve <images> table styling

Hunter
Monday, December 22nd, 2025 at 10:46 PM

main.js
+2
-2

34  		const images = Array.from(stockImages.values()).sort();
35  		if (images.length === 0) return '<p>No images available</p>';
36  		const rows = images.map(filename =>
   -			`<tr><td>${filename}</td><td style="text-align:center;"><img src="images/${filename}"></td></tr>`
37 +			`<tr><td>${filename}</td><td style="text-align:center;"><img src="images/${filename}" style="max-width:100%;height:auto;"></td></tr>`
38  		).join('');
   -		return `<table border="1" cellpadding="8" cellspacing="0" style="width:100%;"><colgroup><col style="width:50%"><col style="width:50%"></colgroup>${rows}</table>`;
39 +		return `<table border="1" cellpadding="8" cellspacing="0" style="max-width:100%;box-sizing:border-box;table-layout:fixed;"><colgroup><col style="width:50%"><col style="width:50%"></colgroup>${rows}</table>`;
40  	});
41  }
42  const editorPane = document.querySelector('.editor-pane');