2015-05-20 2 views
0

Я пытаюсь закодировать свое собственное меню кругов с Yii, например, Inbox от Google.Пространство между divs и отключить анимацию hover

Это почти сделано, но мне нужно удалить пространство между .circle_sub созданный из .circle_title.


<div id="circle_area"> 
    <div class="circle_main">MAIN</div> 
    <div class="circle_sub"> SUB</div> 
    <div class="circle_title">HINT</div> 
    <div class="circle_sub"> SUB</div> 
    <div class="circle_title">HINT</div> 
</div> 

Весь код с CSS here.

+0

использовать положение: абсолютный; в месте позиции: относительный; in .circle_title –

+0

Я не могу, потому что тогда все .circle_title будут отображаться в одном месте. Мне нужен каждый .circle, расположенный рядом с его предшественником DOM. – Bejkrools

ответ

0

Вам необходимо создать контейнер для каждого элемента подменю и установить position: relative;, а position: absolute; - .circle_title.

Пример на JSFiddle: http://jsfiddle.net/n2gknokL/

Я также обновил JS соответственно ...

+0

Я изменил **. Title_circle ** css ** левый ** на ** правый **, потому что мне нужно постоянное расстояние между заголовком и суб. Это, похоже, имеет дело с необходимостью однострочного намека даже для длинной строки. Проверьте, пожалуйста [code] (http://jsfiddle.net/n2gknokL/1/) – Bejkrools

+2

Чтобы исправить это, просто добавьте 'white-space: nowrap;' в '.circle_title'. Это должно помочь :) –

+0

Кто-нибудь знает, почему MAIN HINT (рядом с MAIN) иногда исчезает с задержкой? [JSFiddle] (http://jsfiddle.net/684jqk5n/) – Bejkrools

Смежные вопросы