Резиновый блок по центру, резиновые с боков

Тема в разделе "Верстка", создана пользователем stasionok, 23 июл 2013.

Информация :
Уважаемые пользователи, прежде чем ответить в теме или создать новую, внимательно ознакомьтесь с Правилами раздела и Правилами форума
Для быстрого поиска ответов на ваши вопросы воспользуйтесь Картой раздела и/или Поиском по разделу
Модераторы: ultra
  1. stasionok

    stasionok

    Регистр.:
    29 ноя 2012
    Сообщения:
    287
    Симпатии:
    315
    Возможно тему назвал не правильно.
    Вопрос стоит в следующем:
    title_03.jpg
    Ширина рабочей области фиксирована, а вот текст может быть разной ширины??
     

    Вложения:

    • title_03.jpg
      title_03.jpg
      Размер файла:
      4,7 КБ
      Просмотров:
      26
  2. aaliseyko

    aaliseyko Создатель

    Регистр.:
    17 ноя 2011
    Сообщения:
    17
    Симпатии:
    6
    как вариант:
    Код:
    <div class="wrap">
    <div class="title">
    <span class="ball"></span>
    <span class="text">О компании</span>
    <span class="ball"></span>
    </div>
    </div>
    <div class="wrap"> - имеет фон в виде синей горизонтальной линии (сплошной, без разрывов), все что в нем по центу
    <div class="title"> - может быть и тэг заголовка, не суть... фон белый, можно залить один белый пиксель. Суть - перекрыть синюю полоску обертки wrap
    <span class="ball"> - background - синий шарик
    <span class="text"> - тут отступы задать нужные.

    от последнего спана можно избавиться... или от первого, если к белому фону и titlе еще и шарик добавить.
     
    stasionok нравится это.
  3. stasionok

    stasionok

    Регистр.:
    29 ноя 2012
    Сообщения:
    287
    Симпатии:
    315
    о я кажется понял смысл, хоть и костыль, но думаю получится
    <div class="wrapp">
    <div class="title">
    <span>TITLE</span>
    </div>
    </div>
    wrapp - полоска
    .title - точка справа на паддинге
    span - точка слева
     
  4. aaliseyko

    aaliseyko Создатель

    Регистр.:
    17 ноя 2011
    Сообщения:
    17
    Симпатии:
    6
    да, так еще лучше. :)
    оба спана в топку - только тайтл оставить.
    И будет вполне себе разина. Успехов.
     
  5. Compressor

    Compressor

    Регистр.:
    31 янв 2009
    Сообщения:
    314
    Симпатии:
    200
  6. aaliseyko

    aaliseyko Создатель

    Регистр.:
    17 ноя 2011
    Сообщения:
    17
    Симпатии:
    6
    Есть, да не про нашу честь. :) 7-й ослик отбрасывает сразу копытца, а это не дело.
     
  7. allseo

    allseo Создатель

    Регистр.:
    26 июн 2013
    Сообщения:
    38
    Симпатии:
    10
    Для ослика же есть костыль. Не стоит жертвовать семантикой, читаемостью и легковесностью ради кроссбраузерности. Старые ослики рано или поздно подыхают, а рефакторить потом будет очень сложно.
     
  8. aaliseyko

    aaliseyko Создатель

    Регистр.:
    17 ноя 2011
    Сообщения:
    17
    Симпатии:
    6
    Угу, для :before и :after костыль, для уголочков pie, для html5 костыль на js, а для... и понеслась... Ладно, я вас понял