Отцентровать картинку неизвестных размеров

Автор Тема: Отцентровать картинку неизвестных размеров  (Прочитано 3716 раз)

Оффлайн webFinderАвтор темы

  • Бизнес оценка: (0)
  • Рекрут
  • *
  • СПАСИБО: 1
  • Сообщений: 48
  • Карма: 0
    • Просмотр профиля

Оффлайн webFinderАвтор темы

  • Рекрут
  • *
Никак не получается разместить картинку по центру
Код:
Только зарегистрированные пользователи могут видеть код. Пожалуйста, войдите или зарегистрируйтесь.
А вот мой текущий CSS
Код:
Только зарегистрированные пользователи могут видеть код. Пожалуйста, войдите или зарегистрируйтесь.
На данный момент картинка "отцентрована" по горизонтали, но по вертикали не получается вообще. И что больше всего мне не нравится - это выглядит так как будто ссылка выравнивается относительно картинки, хотя должно быть наоборот.


Оффлайн Sevab

  • Администратор
  • Бизнес оценка: (6, 100%)
  • *****
  • СПАСИБО: 9887
  • Сообщений: 14502
  • Карма: 664
  • Пол: Мужской
    • Просмотр профиля
    • Trust Directory Project

Оффлайн Sevab

  • Администратор
  • *****
Код:
Только зарегистрированные пользователи могут видеть код. Пожалуйста, войдите или зарегистрируйтесь.

Оффлайн drummer

  • Бизнес оценка: (1, 100%)
  • Старожил
  • ****
  • СПАСИБО: 224
  • Сообщений: 433
  • Карма: 42
  • Пол: Мужской
    • Просмотр профиля
    • Веб-студия "MKSITE"

Оффлайн drummer

  • Старожил
  • ****
Или просто
Код:
Только зарегистрированные пользователи могут видеть код. Пожалуйста, войдите или зарегистрируйтесь.

Оффлайн lexxxx

  • Бизнес оценка: (0)
  • Пользователь
  • **
  • СПАСИБО: 6
  • Сообщений: 88
  • Карма: 3
  • Пол: Мужской
    • Просмотр профиля
    • 4respect.ru - только русский рэп

Оффлайн lexxxx

  • Пользователь
  • **
По вертикали просто так не отцентрировать. Тут есть два варианта:

1. Делаем body и html высоту 100%, поместить ваши картинки в таблицу, в таблице задать высоту и ширину 100%, потом столбцу ширину 100%, высоту 99%, ну и вырабнивание по середине (vertical-align:middle)

2. Это широко известный вариант с divом. Обернуть все это дело в div, ему задать ширину и высоту, затем position:absolute; left:50%; top:50%; margin-top: (-половина высоты), margin-left: (- половина ширины).

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

Оффлайн SeoBrabus

  • Глобальный модератор
  • Бизнес оценка: (6, 100%)
  • *****
  • СПАСИБО: 1055
  • Сообщений: 4059
  • Карма: 284
  • Пол: Мужской
  • Награды Более одной тысячи спасибо Мастер поисковой оптимизации Почетный гражданин нашего форума
    • Просмотр профиля
    • Сайт на заказ, продвижение сайтов.

Оффлайн SeoBrabus

  • Глобальный модератор
  • *****
тоже столкнулся с проблемой правда немного другого параметра, вот сайт avtomatoff.com в материале на главной есть карусель из фото, в ФФ отображается все нормально а вот опера не хочет (немерено растягивает картинки), кто что может посоветовать?
CSS
   .roundabout-holder {
         padding: 0;
         height:135px;
         list-style: none;
         width:250px;
         margin: 0px 0px 0px  0px;
      z-index:1;
   }
   
   .roundabout-moveable-item {
      width:50px;
        height: 100px;
      margin-left: 0px;
      cursor: pointer;
     z-index:1;
   }
   
   .roundabout-moveable-item img {
        width:100%;
        height: 100%;
      margin-left: 0px;
      cursor: pointer;
     z-index:1;
   }
      


   .roundabout-in-focus { cursor: auto; }
   .roundabout-holder img {  border: 0px solid #fff;}


 

Похожие темы

  Тема / Автор Ответов Последний ответ
6 Ответов
2818 Просмотров
Последний ответ 18-10-2011, 10:59:54
от Avadon
4 Ответов
1391 Просмотров
Последний ответ 02-10-2012, 06:50:10
от mixail366
5 Ответов
3929 Просмотров
Последний ответ 09-06-2016, 07:13:00
от alluseful
2 Ответов
910 Просмотров
Последний ответ 29-03-2018, 08:02:37
от Droga1979
7 Ответов
1359 Просмотров
Последний ответ 12-11-2018, 22:29:32
от ter500