Изображения очень большие и смещенные в моем контейнере [закрыто] ⇐ Javascript

[Anonymous]

У меня есть вывод, он дает мне нежелательный результат с некоторыми изображениями, которые я загрузил на веб -сайт, чтобы создать или создать библиотеку плагинов Fotorama jQuery JavaScript, я сделал весь процесс точно так же, как инструкции указывают на веб -сайте jQuery и на изображениях. очень большие и смещенные в моем контейнере, я сделал несколько устранения неполадок, и ничего нельзя сделать, чтобы регулировать изображения, чтобы изображения соответствовали контейнеру и уменьшали их до соответствующего размера. Пожалуйста, дайте мне знать, что я должен делать в дополнение к тому, что я уже сделал. Спасибо! Продолжайте отображаться в размере не подходящего с контейнером и чрезмерно большим, что их нельзя контролировать или манипулировать..grid.content {
display: flex;
/*Use flexbox layout */
flex-direction: column;
/* Arrange items vertically */
justify-content: center;
/* Center items vertically */
align-content: center;
/* Center items horizontally */
padding: 20px;
background-color: #f8f9fa;
border-radius: 10px;
border: 1px solid #007bff;
min-height: 300px;
/* Ensure the container has some height */
text-align: center;
/* Ensure text is centered */
}

.grid.content {
grid-column: span 2;
/*Each takes up two columns */
grid-row: auto;
/* Auto height based on content */
}

.grid.content .section .narrow-paragraph {
max-width: 1000px;
/* Limit the width for narrow paragraphs */
margin: 0 auto;
/* Center the content horizontally */
text-align: justify;
/* Justify text for better readability */
}

/* Styling the image wrapper */
.image-wrapper {
display: flex;
/* Use flexbox to control alignment */
justify-content: center;
/* Center the image horizontally */
align-items: center;
/* Center the image vertically */
margin: 15px 0;
/* Add some vertical margin for spacing */
padding: 10px;
/* Add padding around the image */
background-color: #f0f0f0;
/* Light background color */
border-radius: 10px;
/* Consistent border radius */
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
/* Subtle shadow effect */
max-width: 100%;
/* Ensure the wrapper does not exceed the container width */
}

/* Ensure existing .the-image styles are maintained */
.image-wrapper .the-image {
width: 100%;
max-width: 500px;
height: auto;
border-radius: 10px;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
margin-top: 20px;
}

.fotorama {
width: 100%;
/* Ensure the gallery takes the full width of its container */
height: auto;
/* Maintain aspect ratio */
max-width: 1000px;
/* Set a maximum width to prevent it from being too large */
margin: 0 auto;
/* Center the gallery within its container */
}

.fotorama img {
max-width: 100%;
/* Ensure images do not exceed the container width */
max-height: 100%;
/* Allow images to expand based on content */
height: auto;
/* Maintain aspect ratio */
}
< /code>





Who Are We?

This is a website that will help you choose travel insurance
according to your needs and budget. Travel insurance has different coverage and plans that will help you travel to your destination safely and protected. More than just offering you travel insurance. We give you risk prevention tips.










Our service is completely free, we present the various modalities,coverage and benefits so that you can choose the one that best suits your needs and budgets. We help you summarize the general, particular and special conditions of your travel assistance contract, we review and check your certificate, so that everything is in accordance with the quote presented.










Our Values

Honesty, Integrity and Responsibility with our customers and their satisfaction guaranteed in our services, support and professional help based on our experience in the insurance area.




< /code>
Эти файлы уже проверили в валидаторах инструментов, это часть моего кода, это не полный код. < /p>
Я попытался настроить Изображения со свойствами CSS до размера, который я хочу, чтобы они были установлены на мои предпочтения, и ничего не происходит, ни одно команда или свойство не работает для регулировки изображений, я применяю правила каскада, специфичности, наследства и селекторов. Спасибо!

Подробнее здесь: https://stackoverflow.com/questions/794 ... -container