Responsive pricetable

[paoad]

Γεια χαρα, 

Παλεύω μ αυτό το πινακάκι κατι ωρες για να το κανω responsive γιατι στο κίνητο φαινεται χάλι. Μπορεί κάποιος να βοηθήσει ?

https://codepen.io/anon/pen/rrRbpb

[alou]

https://codepen.io/alou/pen/zLbQpo

Ένα σημαντικό κομμάτι του responsive βρίσκεται στα media queries, χωρίς να το κουράσεις, ορίζεις ότι είναι λογικό και απαραίτητο να αλλάξει για διαφορετικές αναλύσεις. Δεν θα μπω σε διάφορες θεωρίες που υπάρχουν για το πως είναι καλύτερο να τα χρησιμοποιήσεις, αν θες το ψάχνεις παραπάνω μόνος σου φυσικά.

[XPHSTOS_]

Για αρχή μπορείς να βάλεις ένα box-sizing: border-box; στην κλάση columnsdisney και να τα φέρεις σε μια ευθεία.
Εν ολίγης, το padding αν δεν βάλεις αυτό το rule, προσθέτει στο συνολικό 25% του width οπότε δεν χωράνε όλα σε μια ευθεία.

Αλλά νομίζω ότι τζάμπα κουράζεσαι με τα floats.
Καλύτερα display: flex, είναι πιο εύκολο, γίνεται με λιγότερο κώδικα και υπάρχει μεγάλη συμβατότητα πλέον.
Γενικά θα το προσέγγιζα έτσι:
https://codepen.io/anon/pen/vaPqLb?editors=1100

Επεξ/σία 13 Αυγούστου 2018 από XPHSTOS_
added demo

[paoad]

Αψογοι. Ευχαριστώ