Jump to content
  • 0

Как закрепить картинку в среднем блоке


hieronym
 Share

Question

Здравствуйте, Коллеги!

Сайт на готовом движке http://mobilang.ru

Свертан в три колонки. В средней колонке разместил картинку, но при изменении ширины окна браузера она выпадает вниз. Хотелось бы, чтобы картинка всегда была на месте. при любой ширине окна браузера. Как то это можно сделать?

В CSS файле следующие записи про эти колонки:

 

#leftcol {
position:relative;
top:-10px;
left:-10px;
float:left;
width:260px; /* for IE5/WIN */
voice-family: "\"}\"";
voice-family:inherit;
width:280px; /* actual value */
margin:0 0 -10px 0;
padding:0px;
z-index:5;
}

#rightcol {
position:relative;
top: -10px;
right:-10px;
float:right;
width:300px; /* for IE5/WIN */
voice-family: "\"}\"";
voice-family:inherit;
width:280px; /* actual value */
margin: 0 0 -10px 0;
padding:5px;
background:none;
z-index:4;
}

 

#centercol {
position:relative;
padding:0px;
margin:-10px 250px 0px 275px;

}

 

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

 

Вроде вопрос не сложный, но в интернете не нашел ответ.

Link to comment
Share on other sites

6 answers to this question

Recommended Posts

  • 0

Верстка у твоего движка кривая. Для начала нужно задать картинке размер в процентах, например 100%. Но это не даст результатов, пока центральная колонка будет наезжать на правую. Картинка будет пытаться занять всю ширину центрального контейнера, поэтому она опустится в самый низ, где ей не будет мешать выпирающая правая колонка.

 

Учись использовать веб инспектор браузера и большую часть проблем сможешь решать самостоятельно.

Edited by Bassline
Link to comment
Share on other sites

  • 0

Т.е. задание картинки ширины в процентах не поможет. Как совет, что мне нужно учиться, принимаю. Но может, кто то подскажет, что конкретно можно сделать для решения проблемы?

Link to comment
Share on other sites

  • 0

Теперь в силу изменения верстки вылезла следущая проблема:

 

 

5 причин изучать английский, немецкий или итальянский язык по Скайпу с Mobile Language School:
  1. Наши преподаватели проходят тщательный отбор.
  2. Мы предлагаем Вам индивидуальное обучение по цене обучения в группе без необходимости оплаты более двух занятий сразу.
3. Наша уникальная методика гарантирует, что Вы начнете говорить на иностранном языке с первых занятий.
4. Если Вы решите прекратить обучение по любой причине - мы возвратим внесённые авансом деньги по первому требованию.
5. Процесс обучения и его эффективность контролируется нашими методистами.

 

Первый и второй пункты текста в средней колонке почти всегда смещены. Смотрю html через веб-агент, там все ок. Опять что-то с версткой? Как поправить?

Edited by hieronym
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Answer this question...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy