Позиционирование кнопки.

[vladmitrich]

Сайт на джумле. Установил плагин кнопку "Наверх". Но она отображается в правом нижнем углу браузера. Вот часть кода:

<a href="#top" class="backtotop" style="position: fixed; bottom:0px; right:0px;"><><img src="/plugins/content/top.png" alt="scroll back to top" border="0" />

Как можно изменить стиль, чтобы кнопка отображалась в футере сайта или как прописать чтобы позиционирование считалось не от правого угла браузера, а от правого угла рамки сайта?

[george75]

Сайт на джумле. Установил плагин кнопку "Наверх". Но она отображается в правом нижнем углу браузера. Вот часть кода:

<a href="#top" class="backtotop" style="position: fixed; bottom:0px; right:0px;"><><img src="/plugins/content/top.png" alt="scroll back to top" border="0" />

Как можно изменить стиль, чтобы кнопка отображалась в футере сайта или как прописать чтобы позиционирование считалось не от правого угла браузера, а от правого угла рамки сайта?

А описание класса backtotop в CSS можно + контейнер родитель и сразу описание родителя в CSS?

[zSpx]

style="position: fixed; bottom:0px; left:0px;"

А вообще, как писал george75, нужно такие вещи (определение стилей) выносить во внешний CSS.

а от правого угла рамки сайта

Имелось в виду, я так понимаю, от края контейнера? Ну тогда ему нужно задать position: relative и в него положить ту ссылку.

[vladmitrich]

Как писал выше это компонент и у него свои файлы и вложить код в другой контейнер это значит вырезать его из своего файла scrollbacktotop.php и вписать в index.php. Если это и возможно то я не представляю как.

Что касается стилей, то у компонента их нет. Строка - style="position: fixed; bottom:0px; left:0px;" является единственным стилем.

А вот стили для class="backtotop" нигде не могу найти, возможно они берутся из внешнего источника. Когда убираю этот класс то позиция не меняется, только работоспособность кнопки.

[zSpx]

А ширина сайта фиксированная?

Ну так для .backtotop в общем файле стилей нужно определить позицию. Только !important добавлять придется.

Edited September 20, 2011 by zSpx

[vladmitrich]

Ширина фиксированная.

А как можно в файле стилей определить позицию и как пользоваться !important?

[zSpx]

Допустим ширина сайта 900px, тогда нужно позиционировать кнопку на 50% в любую сторону и с помощью margin сдвинуть на половину ширины контента + ширина самой кнопки (к примеру ее ширина 40px), примерно так:

.backtotop {
left:50% !important;
margin-left: -470px;
}

Это нужно добавить в css файл.

[vladmitrich]

Да, это сработает. Но кнопка ведь будет менять место положения в мониторах разной ширины.