The following promtpt was used to generate HTML/CSS code for a live stream webpage:
Write an html page. Add a h1 element for the title. The title should be centered in the top of the screen. Add a videos grid at the left of the screen. The videos grid should cover 80% of the horizontal space of the screen. In the remaining 20% add a chat where each message is a p element. The chat height should be fixed and a scroll bar should be added when needed. Fixed at the bottom of the chat add a text input and a button that allows to add new messages.
When there is only one video in the videos grid, it should cover the whole grid. When there a two videos these should cover half of the grid each one, when there are three or more videos these should be rendered in a 3x3 grid.
Use a nice font with light gray background.
And here's what ChatGPT replied: