Я знаю, что мы не должны применять изображения , но показывать изображение - лучший способ показать ожидаемый выход, который я хочу. Возьмите всю зеленую зону. Я пытался сделать ширину и высоту = 100%, но он все еще не занимает желаемое пространство < /p>
Код: Выделить всё
body {
background-color: rgba(66, 65, 65, 0.192);
font-family: Arial, sans-serif;
margin: 0;
}
h1, p {
color: rgba(0, 0, 0, 0.8);
text-align: center;
margin: 20px 0; /* Avoid large margins */
}
p{
font-size: 30px;
}
.profile-photo {
display: block;
margin: 20px auto; /* Center image */
width: 250px;
height: 200px;
border-radius: 20%;
object-fit: cover;
position: relative;
z-index: 2; /* Ensure it's above the square */
}
.square {
width: 100%;
height: 175px;
background-color: rgba(203, 137, 4, 0.619);
position: relative;
margin-top: -150px;
z-index: -1;
}
.frame {
border : black 2px solid; /*added to visualize the size of .frame*/
flex-grow: 1;
width: 90%;
max-width: 100%;
margin: 0 auto;
background-color: white;
padding: 20px;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
display: flex;
flex-direction: column;
}
table {
width: 100%;
border-collapse: collapse;
border-radius: 20%;
}
th, td {
border: 1px solid #273b38; /* This is the border of the table */
padding: 8px;
text-align: left;
}
th {
background-color: #55f3f04d; /* first colum */
}< /code>
My Portfolio
Welcome to My Website
Hi, I'm Gustavo, a cybersecurity and developmententhusiast learning C and C++!
[img]School_ID/TEST_IMAGE.jpg[/img]
Project Name
Description
Project 1
A brief description of Project 1.
Project 2
A brief description of Project 2.
Подробнее здесь: https://stackoverflow.com/questions/794 ... ter-square