Вставить в шапку баннер

@Mihail_Rusich · Регистрация: 13.01.2018

Author24 — интернет-сервис помощи студентам

Приветствую. Можете помочь вставить в шапку http://download-samp.ru баннер 468*60?
В данный момент она выглядит так:

HTML5

1	<img width="100%" src="/images/sgl.png" alt="">

@Academik · 16.07.2018, 20:38

Mihail_Rusich, помочь можем если опишите желаемый результат.

@Mihail_Rusich · 16.07.2018, 20:44 **[ТС]**

Mr Coder, что то подобное со скриптом от num-link:
[del]

@Academik · 16.07.2018, 21:05

Mihail_Rusich, доработайте под себя

CSS

1	.banner{position: absolute; top: 30px; right: 30%;}

HTML5

1 2	<section class="my-page"> <div class="banner"><a href="#"><img src="/images/banner.jpg"></a></div>

Только не советую имена стилей задавать как "banner, bnr" и т.д., такие блоки вырезают плагины для браузеров по типу adblock, adguard и т.д.

@Mihail_Rusich · 16.07.2018, 23:04 **[ТС]**

Mr Coder, он получается не в шапке:
[del]

@master114 · 16.07.2018, 23:35

нужно родителю дописать относительное позиционирование

CSS

1
2
3

section {
  position: relative;
}

@Mihail_Rusich · 16.07.2018, 23:37 **[ТС]**

master114, не совсем понял.

@master114 · 16.07.2018, 23:42

у вас баннер позиционируется абсолютно всего сайта, вот он и показывается наверху.
А если добавите в файл CSS для вашей секции section указанную строку, то баннер будет позиционироваться относительно (внутри) этой секции.

@Mihail_Rusich · 17.07.2018, 00:32 **[ТС]**

master114, и будет в шапке?
Добавил section, всё осталось также.

@master114 · 17.07.2018, 07:35

покажи кусок html кода куда ты вставляешь новый баннер

section я брал из приведенного выше куска

HTML5

1 2	<section class="my-page"> <div class="banner"><a href="#"><img src="/images/banner.jpg"></a></div>

Добавлено через 22 минуты

HTML5

<div class="wrapper">
       <h1>Фото</h1>
       <img class="top-bnr" src="new_banner.png" alt="">
        <img src="main_banner.png" alt="" ">    
    
    </div>

и css код

CSS

.wrapper {
    
position:relative;
}
 
.top-bnr {
    position:absolute;
    left: 50%;
    margin-top: 20px;
}

в css коде для нового баннера сделал отступ сверху 20px и выровнял его по центру

@Academik · 17.07.2018, 09:05

Сообщение от master114

нужно родителю дописать относительное позиционирование

Прежде чем давать советы загляните в код. У родителя присутствует свойство position: relative;

@master114 · 17.07.2018, 09:37

не спорю, прописано.
Если новый баннер улетает вверх, значит код вставляет не туда. Поэтому и попросил показать его код и написал пример вставки, где все работает

@Mihail_Rusich · 17.07.2018, 11:37 **[ТС]**

master114,

HTML5

<section class="my-page">
<div class="wrapper">
       <h1>Фото</h1>
       <img class="top-bnr" src="new_banner.png" alt="">
        <img src="main_banner.png" alt="" ">    
    </div>

Мне надо бы вставить скрипт вместо img:

HTML5

1	<script type="text/javascript" src="//num-link.ru/banner/list/7502"></script>

@master114 · 17.07.2018, 12:59

[del]

поможет

@Mihail_Rusich · 17.07.2018, 13:43 **[ТС]**

master114, не совсем понял ту тему.

@master114 · 17.07.2018, 14:16

Вместо

HTML5

1	<img class="top-bnr" src="new_banner.png" alt="">

вставьте

HTML5

1	<div class="top-bnr"><script type="text/javascript" src="//num-link.ru/banner/list/7502"></script></div>

@Mihail_Rusich · 17.07.2018, 14:22 **[ТС]**

master114, а можно полный скрипт? А то у меня теперь и изображения шапки нету.

@master114 · 17.07.2018, 14:29

HTML5

<div class="wrapper">
       <h1>Фото</h1>
       <div class="top-bnr"><script type="text/javascript" src="//num-link.ru/banner/list/7502"></script></div>
        <img src="/images/sgl.png" alt="" ">    
    
    </div>

CSS

.wrapper {
    
position:relative;
}
 
.top-bnr {
    position:absolute;
    left: 50%;
    margin-top: 20px;
}

@Mihail_Rusich · 17.07.2018, 15:07 **[ТС]**

master114,
У меня же шапка так выглядит:

HTML5

1 2	<section class="my-page"> <img width="100%" src="/images/sgl.png" alt="">

Обязательно это?

HTML5

1 2	<div class="wrapper"> <h1>Фото</h1>

@master114 · 17.07.2018, 15:10

HTML5

<section class="my-page">
              <div class="top-bnr"><script type="text/javascript" src="//num-link.ru/banner/list/7502"></script></div>
              <img src="/images/sgl.png" alt="" ">        
          </section >

CSS

.my-page {
    
position:relative;
}
 
.top-bnr {
    position:absolute;
    left: 50%;
    margin-top: 20px;
}

@Academik 1025 / 678 / 295 Регистрация: 04.04.2013 Сообщений: 2,709
	16.07.2018, 20:38	2
	Mihail_Rusich, помочь можем если опишите желаемый результат. 0

@Mihail_Rusich 0 / 0 / 0 Регистрация: 13.01.2018 Сообщений: 48
	16.07.2018, 20:44 [ТС]	3
	Mr Coder, что то подобное со скриптом от num-link: [del] 0

@Mihail_Rusich 0 / 0 / 0 Регистрация: 13.01.2018 Сообщений: 48
	16.07.2018, 23:04 [ТС]	5
	Mr Coder, он получается не в шапке: [del] 0

@Mihail_Rusich 0 / 0 / 0 Регистрация: 13.01.2018 Сообщений: 48
	16.07.2018, 23:37 [ТС]	7
	master114, не совсем понял. 0

@master114 12 / 12 / 3 Регистрация: 04.07.2018 Сообщений: 47
	16.07.2018, 23:42	8
	у вас баннер позиционируется абсолютно всего сайта, вот он и показывается наверху. А если добавите в файл CSS для вашей секции section указанную строку, то баннер будет позиционироваться относительно (внутри) этой секции. 0

@Mihail_Rusich 0 / 0 / 0 Регистрация: 13.01.2018 Сообщений: 48
	17.07.2018, 00:32 [ТС]	9
	master114, и будет в шапке? Добавил section, всё осталось также. 0

@Academik 1025 / 678 / 295 Регистрация: 04.04.2013 Сообщений: 2,709
	17.07.2018, 09:05	11
	Сообщение от master114 нужно родителю дописать относительное позиционирование Прежде чем давать советы загляните в код. У родителя присутствует свойство `position: relative;` 0

@master114 12 / 12 / 3 Регистрация: 04.07.2018 Сообщений: 47
	17.07.2018, 09:37	12
	не спорю, прописано. Если новый баннер улетает вверх, значит код вставляет не туда. Поэтому и попросил показать его код и написал пример вставки, где все работает 0

@master114 12 / 12 / 3 Регистрация: 04.07.2018 Сообщений: 47
	17.07.2018, 12:59	14
	[del] поможет 0

@Mihail_Rusich 0 / 0 / 0 Регистрация: 13.01.2018 Сообщений: 48
	17.07.2018, 13:43 [ТС]	15
	master114, не совсем понял ту тему. 0

@Mihail_Rusich 0 / 0 / 0 Регистрация: 13.01.2018 Сообщений: 48
	17.07.2018, 14:22 [ТС]	17
	master114, а можно полный скрипт? А то у меня теперь и изображения шапки нету. 0