0

Ребята, короче, такие дела уже по-моему задавал тут вопрос этот . Не могу вертикально отцентровать элемент (в хроме норм, а в IE и firefox - нет )

http://afisha.net.ru

https://i.imgur.com/I0njTUV.png

введите сюда описание изображения

<div class="main  mx-auto mb3" style="margin-top: 135px">
	<div class="clearfix mxn1">
		<div class="md-col md-col-9 px1  ">


				<div class="relative">


<div class="my-slider">

<?php 
global $db;
$abc = $db->query("SELECT * FROM admin_panel WHERE label='slider' ORDER BY id desc LIMIT 0,6 ");
while ($data = $abc->fetch_array()) 
{ ?>
				<div class="relative zoom-blurb">
				<div class="absolute table white mx-auto top-0 left-0 right-0 bottom-0 cover-text z1"><div class="table mx-auto">
					
						<p class="h1 mb1 "><?php echo $data['title'] ?></p>
						<p class=" mt0 mb0 xs-hide">Категория: <?php echo $data['category'] ?> Опубликовано <?php echo showDate($data['datetime']) ?></p>
						<p class="h3 mt1 xs-hide"><?php echo $data['slogan'] ?></p>


				</div></div>
				<a href="fullpost/<?php echo $data['id'] ?> "><img src="<?php echo $data['image']; ?>" alt=""></a>
			</div>


<?php }

 ?>

</div>
<!-- or ul.my-slider > li -->
<script src="https://cdnjs.cloudflare.com/ajax/libs/tiny-slider/2.8.2/min/tiny-slider.js"></script>
<!-- NOTE: prior to v2.2.1 tiny-slider.js need to be in <body> -->




<script>
  var slider = tns({
    container: '.my-slider',
    items: 1,
    slideBy: 'page',
    controls: true,
    nav:true,
    controlsText: ['<','>'],
    autoplay: false
  });

</script>

								



 	</div>

PS Да, и там используются классы с фреймворка BassCSS, для упрощения стилизации; tiny-slider 2.0 github.com/ganlanyuan/tiny-slider

6
  • Каким способом в Chrome выравниваете?
    – lazyproger
    30 авг 2018 в 4:54
  • 1
    Если уже задавал такой вопрос, который был так же оформлен и не получил ответа и помощи, боюсь и сей раз ничего не измениться... Оформи вопрос надлежащим образом...
    – Air
    30 авг 2018 в 5:09
  • Блин, там просто там громоздкий код ( то есть внутри див див див див див див итд ) Крч нужно разместить текст внутри слайдера, но чтобы текст был блоком и внутри этого блоко выравнивание текст по левому краю было. Получилось чтобы заработало использовать таблицы ( но как видите не везде работает ) 30 авг 2018 в 5:33
  • это какой там слайдер ? и в любом случае надо видеть исходники
    – user33274
    30 авг 2018 в 6:38
  • Написано смотреть пример, а примера в вопросе нет... Ну как так-то
    – andreymal
    30 авг 2018 в 16:30

1 ответ 1

1

Насколько я увидел, продравшись сквозь тонны всякого, там для центрирования используется блочок с абсолютным позиционированием и несколькими несовместимыми свойствами. Хром умеет разбираться с таким безобразием, позволяя разработчикам косячить, прочие браузеры - еще нет.

Универсальный и красивый способ центрирования абсолютно позиционированного блока любых размеров:

.my_class {
  position:absolute;
  left:50%;
  top:50%;
  transform:translate(-50%, -50%);
}
3
  • Нет - этот способ не работает внутри слайдера. - Я пробовал давно много раз. 31 авг 2018 в 4:54
  • @LyubaIvanova вы можете по человечески пояснить что требуется ?
    – user33274
    31 авг 2018 в 5:51
  • если не работает внтури слайдера, значит, там что-то накосячено. 19 сен 2018 в 13:24

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge you have read our privacy policy.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.