Почему не влезает картинка?

Question

[squirtazzer]

z-mesta.com/komanda
Картинка почему то уходит за пределы слева.Обрезаются имена. Должна быть такой z-mesta.com/wp-content/uploads/2017/08/12.png
Как это поправить?

Comments

[Ankhena]

Потому что блок с картинкой на всю ширину экрана, а левая колонка наложена сверху.

[squirtazzer]

Ankhena W: как это поправить?сайт не я делал

[Ankhena]

squirtazzer: например, сделать так, чтобы левый блок отодвигал правый, а не накладывался.

[squirtazzer]

Ankhena W: и?как это сделать?

[Ankhena]

squirtazzer: Например, задать им общую обертку и ей флекс. Или, по старинке, инлайн-блоками. Или задать левый margin правому блоку и правильную ширину. Потом проверить на смартфонах, я не смотрела, что там с адаптивом.

[squirtazzer]

Ankhena W: я не знаю как.можете прислать код и куда его вставлять?

[squirtazzer]

Ankhena W: или хотя бы что гуглить.

[Ankhena]

squirtazzer: Вам, видимо, на фриланс

[squirtazzer]

Ankhena W: ясно.спасибо за помощь блин.сложно прислать три строчки кода?

[Ankhena]

squirtazzer: не забывайтесь

можете прислать код и куда его вставлять?

Это задание, а не вопрос. На ту часть, которая была вопросом я ответила. С заданиями - на фриланс.

Хотите, читайте https://html5book.ru/css3-flexbox/ и делайте, не получится, выкладывайте код и спрашивайте конкретику.

Answer 1

[Денис Юдин]

Обновите CSS для класса на этот:

.Kartinka {
    /* width: 100%; */
    height: 100%;
    position: absolute;
    top: 0;
    /* left: 00%; */
    right: 0;
}

Comments

[squirtazzer]

Спасибо большое

[Денис Юдин]

squirtazzer: не за что, т.к. то, как сверстано у вас в макет - это не совсем правильно, если не сказать больше - криво, т.к. при средних и маленьких разрешениях - картинка все равно уезжает под меню. Один из вариантов "лечения" - картинку положить фоном и назначить ей свойство background-size

[squirtazzer]

Денис Юдин: Не правильно не то слово.Делал не я.там вместо страниц произвольные поля например.Я уже ЗАДОЛБАЛСЯ с этим сайтом. Я не понимаю как эти поля редактировать. И если можно еще один вопрос. На главную когда входишь поплавок "прелоадер" грузится.Но этот поплавок не грузится на остальных "страницах" как это поправить?насчет картинки,да в мобильной версии не помещается она(

[squirtazzer]

Денис Юдин:


body {
background-image: url(/wp-content/uploads/2017/08/12.png); /* Путь к фоновому изображению */

}


вот такой код должен быть чтобы фоном?

[Денис Юдин]

squirtazzer: посмотрел бегло - там бяда-бяда вообще в коде страницы. Поплавок добавлен, видимо, только для главной. Вообще, нужен доступ к админке (к теме сайта) - могу посмотреть. А снаружи видно только то, что жестоко все. Оптимизации скриптов, загрузки и пр - зеро!.. Ну и по верстке тоже не все хорошо.
Если еще и в админке беда - то, может быть, проще тему (дизайн) переверстать под чистую и грамотную WP-тему? Сделать ее "с нуля" согласно Кодексу - реально сайт будет быстрее грузится и работать + адаптив появится

[Денис Юдин]

squirtazzer: ха.. сверстать тексты в разделе z-mesta.com/reka-nilo картинкой - это сильно!

[squirtazzer]

Денис Юдин: вот вот)я хотел текст поправить а там картинки)хлебные крошки вообще были нарисованы) а как редактировать эти поля я не знаю.ибо там просто айди и ничего.я тоже предлагал сделать с нуля,так было бы проще и сам бы сделал,но утвержден этот дизайн и заказчик доволен этим что есть. я могу вам доступ в админку дать,если у вас есть время,чтобы картинку в порядок привести,или просто киньте мне код я втсавлю сам.с прелоадером,попробую на все страницы добавить.как доабвлял фавикон,ибо они почему несмотря на то что прописаны в заголовке,не добавлялись на все страницы.

[Денис Юдин]

squirtazzer: нет. это фон для всей страницы, а у Вас - есть меню и есть основной блок. Можно, конечно, и к body фон прицепить, но тогда нужно само фоновое изображение подредактировать - добавить пустое место слева, чтобы меню не закрывало основное изображение - но это костыль :)

[Денис Юдин]

squirtazzer: не знаю, как Вы добавляли фавикон, но что-то мне подсказывает, что это тоже не валидное решение :) Киньте в меня в личку доступом к админке - посмотрю

[squirtazzer]

Денис Юдин: и что посоветуете?)

[squirtazzer]

squirtazzer: вот так фавикон

[Денис Юдин]

squirtazzer: посоветую - если сайт - это один из основных инструментов продаж\маркетинга\пиар - переделать тему с нуля, если сайт просто для того, чтобы был - по мере возможности заделать все дырки и косяки, но это скорее всего будет возможно только костылями

[squirtazzer]

squirtazzer: кинул

[squirtazzer]

Денис Юдин:

[squirtazzer]

Денис Юдин: вот так

<link rel="shortcut icon" href="" type="image/png">

[Денис Юдин]

squirtazzer: зашел в админку.. как мне теперь это все развидеть?..
- не надо втыкать в шаблоны страниц, тег link для favicon должен размещаться в и только там!.

[Денис Юдин]

squirtazzer: прелоадер реализован плагином, в коде бардак, воткнуты абсолютные ссылки из медиафайлов прямо в шаблоны, даже функция ajax отправки сообщений реализована очень криво и не соответствует кодексу. В общем, резюме - эту тему в морг. Реально с ней разбираться больше времени, чем сделать новую

[Денис Юдин]

squirtazzer:
Вы в контенте страницы разместили:

<head>
 body { 
    background-image: url(/wp-content/uploads/2017/08/12.png); 
    background-position: left bottom; 
    background-repeat: repeat-x; 
   }
</head>

это не будет работать, т.к. это сделано не правильно. тут вообще в корне все неправильно. - это тег html документа, он может быть только 1 на странице, в WP за блок шапки отвечает файл header.php в папке с темой, стили в html прописываются не так - нет обертки, говорящей браузеру, что это CSS ну и т.д. и т.п.

[squirtazzer]

Денис Юдин: ладно помогиет с картикной и если подйут дальнейшие изменения я уже буду предлагать сделать сайт с нуля.ибо это последние изменения на сайте