• Здраво и добредојдовте на форумот на IT.mk.

    Доколку сеуште не сте дел од најголемата заедница на ИТ професионалци и ентузијасти во Македонија, можете бесплатно да се - процесот нема да ви одземе повеќе од 2-3 минути, а за полесна регистрација овозможивме и регистрирање со Facebook и Steam.

Најдобар одговор Преклопување на два CSS елементи

Статус
Оваа тема е решена! Одете до решението…
  • Ја почнал/а темата
  • #1

DrMTR

Guru
27 март 2014
6,829
6,850
www.mikrotikmacedonia.net
Работам на еден сајт, во кој што на мобилната верзија, сакам да ги поткачам насловот на страната погоре, и Cart иконата да оди најгоре во менито, како што е прикажано на сликата подоле:



Пробав со следниов CSS да го поткачам насловот на страната:

Код:
.page-title.color-scheme-light .entry-title {
z-index:999;
margin-top:-60px;
position:relative;
}
и насловот дојде на саканата позиција (пркажано на сликата подолу) , ама сега кога кликам на Cart иконката, не реагира истата.


Изгледа како да се поклопуваат две класи и настанува проблемов. Како да го поткачам Cart иконата на означеното место погоре, а насловот да биде истотака поткачен на саканото место. Однапред благодарам за секој кој што ке помогне да го решам ова.
 
Оваа тема е решена! Одете до решението…

mmarko

Gaining Experience
1 март 2013
166
112
mmarko's setup  
Processor & Cooler
Intel i7-4770K
Motherboard
Asus Gryphon Z87
Storage
Samsung 840 Pro 256GB, Samsung 860 Evo 500GB
PSU
Seasonic M12II Bronze 750W
RAM
Kingston HyperX Beast 2x8GB 1600MHz
Video card
Asus Dual GTX 1060 3GB OC
Case
SilverStone TJ08-E
Mouse
Logitech MX Master 3
Keyboard
X-Bows Ranger w/ Zealios v2 67g
Audio
Sennheiser HD 6XX
Monitor
Dell UltraSharp U2518D + Dell UltraSharp U2412M
OS
Windows 10
Може ќе ти биде поедноставно да го смениш html, да го поместиш елементот или да додадеш нов што ќе биде видлив само на мобилен. Ама ако мораш со css, таа лентата најгоре е со position: fixed, па за да биде кошничката таму, можеш да и ставиш и на таа исто. Пр.

CSS:
.woodmart-shopping-cart {
    position: fixed;
    top: 0;
}
Со тоа што ќе треба и на .whb-main-header да го зголемиш z-index, да биде 10000 или поголем.
 

Triology

Gaining Experience
30 јуни 2008
156
163
1630603225069.png

1630603476499.png

<div class="woodmart-shopping-cart woodmart-cart-design-5 cart-widget-opener" style="
right: 12px;
top: 6px;
">
<a href="Cart - Imperial Supplements">
<span class="woodmart-cart-wrapper">
<span class="woodmart-cart-icon">
</span>
<span class="woodmart-cart-totals">
<span class="woodmart-cart-number">0 <span>items</span></span>

<span class="subtotal-divider">/</span>
<span class="woodmart-cart-subtotal"><span class="woocommerce-Price-amount amount"><bdi><span class="woocommerce-Price-currencySymbol">£</span>0.00</bdi></span></span>

</span>
</span>
</a>
</div>

Ова е ако го преметиш дивот со cart-ot во mob-menu-logo-holder.
 

Атачменти

  • Ја почнал/а темата
  • #5

DrMTR

Guru
27 март 2014
6,829
6,850
www.mikrotikmacedonia.net
Погледнете го атачментот 103736

Погледнете го атачментот 103738

<div class="woodmart-shopping-cart woodmart-cart-design-5 cart-widget-opener" style="
right: 12px;
top: 6px;
">
<a href="Cart - Imperial Supplements">
<span class="woodmart-cart-wrapper">
<span class="woodmart-cart-icon">
</span>
<span class="woodmart-cart-totals">
<span class="woodmart-cart-number">0 <span>items</span></span>

<span class="subtotal-divider">/</span>
<span class="woodmart-cart-subtotal"><span class="woocommerce-Price-amount amount"><bdi><span class="woocommerce-Price-currencySymbol">£</span>0.00</bdi></span></span>

</span>
</span>
</a>
</div>

Ова е ако го преметиш дивот со cart-ot во mob-menu-logo-holder.
Ова е кодот што засега функционира.

Код:
/* Mobile Homepage Fixes */
.woodmart-shopping-cart {
    position: fixed;
    top: 0;
}       
.whb-main-header {
    z-index:10000;
}
.page-title.color-scheme-light .entry-title {
    margin-top: -65px;
    z-index: 19999;
    position: relative;
}
 
Последна промена:
  • Ја почнал/а темата
  • #6

DrMTR

Guru
27 март 2014
6,829
6,850
www.mikrotikmacedonia.net
Пак јас. Истиот проблем со преклопувањето го имам и овде. Пробав и овде да манипулирам со z-index и property ама нешто не функционира како што треба. Сакам да го покренам ова Categories погору во црното поле.



истотака во чекаут полето ми се јавува банер кој што го прекрива Cart полето како на сликата подолу



некој да асистира и овде ? Благодарам.
 
Статус
Оваа тема е решена! Одете до решението…

Нови мислења

Последни Теми

Статистика

Теми
43,518
Мислења
858,346
Членови
29,929
Најнов член
Jov4e
На врв Дно