@iammankatah
Latest comments
- @J0SEED01
Hellow @iammankatah, as a recommendation I would use the measure of pixels (px) to give width to the content so it does not overflow or move every time I go downsizing to see the responsive and to align on the X axis and Y axis with flexbox you must give a height to the container if it does not work is always recommended 100vh and then with flexbox is centered with: display: flex; justify-content: center; align-items: center; and with that you avoid giving margin to the boxes to be centered and that the rest is practice and more practice!!!
Translated with www.DeepL.com/Translator (free version)
Marked as helpful - @chriskorsak@J0SEED01
Hellow!! El diseño se ve bastante bien aun asi mi recomendacion seria que le quitaras el scroll al body con un overflow hidden y ademas tambien le quitaria el outline al input en la pseudoclase :focus que se ve feo ese efecto cuando hago click sobre el input
Saludos!
- @jakewebd@J0SEED01
Hola que tal dejo algunas recomendaciones.
Primero que nada los estilos van en un archivo aparte, te creas una carpeta css y dentro el archivo style.css y ese lo linkeas en el HTML <link rel="stylesheet" href="style.css"> ES UNA PESIMA PRACTICA PONER LOS ESTILOS EN EL DOCUMENTO HTML! y otra recomendacion es que los estilos se dan con clases y no con ID en vez de poner ID poner class osea id="main-container" escribir class="main-container" y en el CSS quedaria asi .main-container{ background-color:rgba(255,255,255,1); width:200px; height:320px; position:absolute; left:42%; top:30%; border-radius:5%; box-shadow:2px 2px rgba(0,0,0,0.1); } y lo otro es que la etiqueta HTML siempre va antes del BODY, te recomiendo aprender bien HTML Y CSS (flexbox y grid) eso por el momento.
Saludos!
