težava z tabelo v responsive

pozdravljeni

na tujih forumih ne najdem pomoči. sam pa tudi nimam znanja, da tole rešim. Vem, da ste tukaj mojstri, tako da res upam da mi nekdo prihrani konkretne ure tuhtanja.

torej;
imam wordpress stran z woocommerc vtičnikom.
težava se pojavi, ko na telefonu gledam košarico (cart page), vse tabele se lepo zložijo v responsive, le ta najmanjša, ki kaže vsoto košarice + ceno poštnine, mi kaže nek čuden layout.

mislim da gre za problem, ker se pod določeno "media screen width" tabele zložijo v responsive (grejo iz ene vrstice v dve), ta najmanša pa se ne rabi (ker je tak mala, da bi se videla tudi v navadnem layoutu.

torej, kako imeti vse tabele v responsive pod 660px, le ena ostane tako kot je (ne resposnive?) oziroma kako drugače tole rešit?

upam da me razumete, nisem programer in imam le nekaj znanja iz css...

najlepša hvala za pomoč

miha

6 odgovorov

ko greš h dohtarju, tudi boleče koleno neseš s sabo, da ga pokažeš ;) kakšen link ne bo odveč ;)

3

Glede na dane informacije: ja, verjetno je res neki narobe.

Za kej več bo treba pa kaj več povedat :)

stran sicer še ni v uporabi in je narejena na pol, trenutno pač odpravljam težave.
v glavnem pa se tole dogaja kar je na linku.

če potrebujete geslo, lahko pošljem zasebno, najraje bi preko maila

http://screencast.com/t/v9yWUYQ5M

hvala

pozdravljeni

ali se tabele nastavijo v css, enako kot kakšen tekst,... da se obnasajo responsive

@media screen and (max-width: 660px) {
.woocommerce .cart-collaterals .carttotals, .woocommerce-page .cart-collaterals .carttotals {

tu sem poskušal da sem nastavil width na 200% in float right. Pač da bi pod 660px raztegnilo tabelo na dvojno velikost (ker je drugače samo polovico vidnega polja) ampak ni spremembe.

ne vem ce se da preko css "izklopit" responsive za določeno tabelo ali pa da prisilim višino in širino tabele z important

widh:100% !important;
height:100% ! important;

ampak kot sem že povedal, sem totalen amater okoli tega in sploh ne vem če se tabele urejajo z css

v glavnem karkoli mi bo v pomoč, da vem vsaj kje naj začnem

link do strani je viden v videu , ki je na povezavi zgoraj

hvala

@media screen and (max-width: 768px) {
    .woocommerce .cart-collaterals .cart_totals tr td { width: auto }
}
6

pozdravljen

DELUJE in skoraj ne morem verjet kako enostavno tole zgleda.

sam sem poizkušal z temle, lol. Sicer je bil tekst viden vendar je bila tabela dejansko raztegnjena, zato robovi tabele niso bili vidni (ne vem kako je izgledalo na tablici)
@media screen and (max-width: 660px) {
.woocommerce .cart-collaterals .carttotals, .woocommerce-page .cart-collaterals .carttotals {
float:left !important;
width: 500% !important;
overflow: visible !important;
}
}

prihranil si mi ogromno časa in živcev.

najlepša hvala

1