@DanteE

Как уменьшить размер div-a w html?

Здраствуйте! У меня есть такая проблема. Я создаю макет будущего поисковика, и самому сделал для неё логотип. Но к сожалению когда я поместил этот самый логотип в код html, и посмотрел на результат, увидел что div занимает огромное место. Попробовал поиграться с размерами в html но результат не очень... Помогите пожалуйста!
5f4eb5126f622725327980.jpeg5f4eb519f2c75183862253.jpeg
  • Вопрос задан
  • 99 просмотров
Решения вопроса 1
@Grejtal
Так у тебя ж на том блоке стоит высота 50%. Конечно же он будет большим.
самый робочий вариант это такой:

.parent {
width: var(--your-width);
height: var(--your-height);
display: block;
/*это чтоб небыло тупых отступов, которые браузер дефолтно ставит*/
margin:0;
padding:0;
border:0;
}


Главное не забудь внутрений контент настроить, чтоб он не полз и не выползал за сам контеинер.
И кстати, что у тебя за названия такие А1, А2, А3...? Это, мягко говоря, плохие названия. Так лучше не делать. Называй классы так, чтоб было понятно, что делает этот класс. Если это контеинер для посковой формы, то это может быть search-container, а если же это, например, какая-то отделельная секция, по типу пост (если в фесбуке или инстагрмме), то лучше использовать для это теги такие как < section >, а не писать не понятно что. Тебе же потом через месяц (или еще когда) прийдеться на тот код смотреть, а с такими креативными названиями, тебе будет проще все заново написать, чем то читать.
Ответ написан
Пригласить эксперта
Ответы на вопрос 2
felony13twelve
@felony13twelve
Картинку обрешь в Фотошопе нормально
Ответ написан
Wolfnsex
@Wolfnsex Куратор тега CSS
Если не хочешь быть первым - не вставай в очередь!
Не совсем понятно что Вы хотите.
1. Есть DIV, в нём есть картинка, вам нужно что бы DIV был размером с картинку? Задайте картинке display: block; а DIV'у display: inline-block;
2. Нужны конкретные размеры DIV'a? Задайте их, либо точные (в px'ах например), либо относительные (%, vw, vh)
3. Или задайте DIV'у картинку фоном, укажите нужные размеры DIV'а и background-size.
4. Воспользуйтесь CSS-Grid'ами и/или FlexBox'ами и различных проблем с размерами станет разительно меньше

P.S. Для разных разрешений и типов экранов и устройств - есть CSS Media query
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы