Προς το περιεχόμενο
  • Εγγραφή
  • 0

Βοήθεια σε css για html table


Lanike71

Ερώτηση

Καλησπέρα,

Ποιές είναι οι ιδιότητες σε css που κάνουν ένα table να έχει διαστάσεις ακριβώς όσο το περιεχόμενο και όχι παραπάνω;

Συγκεκριμένα έχω ένα πίνακα μέσα σε div, ο οποίος δημιουργείται δυναμικά με js. Παρ' όλο που το ορισμένο font είναι μικρό, ο πίνακας επιμένει στις διαστάσεις του.

Έχω ψάξει τα πάντα σε stack αλλά δε διορθώνεται.

Κάποια βοήθεια;

Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες

9 απαντήσεις σε αυτή την ερώτηση

Προτεινόμενες αναρτήσεις

  • 0
Δημοσ. (επεξεργασμένο)

Καλησπέρα.

Στο bootstrap βάζεις την class .table-responsive .

Αμα δεν χρησιμοποιείς το bootstrap με αυτό το κώδικα μπορείς να το κάνεις responsive

<div style="overflow-x:auto;">
  <table>
    ...
  </table>
</div>

 

Επεξ/σία από gekatsou
Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες
  • 0

To overflow-x : auto προσθέτει οριζόντιο scrollbar, κάτι που δεν το θέλω και το έχω θέσει hidden. Ακόμα και που δοκίμασα, πάλι έφτιαξε το μέγεθος που ήθελε και έκρυψε ένα κομμάτι του πίνακα, εμφανίζοντας το scrollbar.

Το responsive επίσης δε δούλεψε...

Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες
  • 0

Καλησπέρα φίλε!
Προτείνω να το βάλεις μέσα σε ένα div με class row με ένα col-md-12 μέσα του, και μέσα του να βάλεις το table.
Αυτό που περιγράφεις επάνω είναι απλά ένα style:width: 100%; στο table.
Απο την άλλη ίσως σε βοηθούσε να χρησιμοποιήσεις αυτό, το χρησιμοποιώ σε όλα μου τα έργα και είναι καταπληκτικό.
https://datatables.net/

Γιώργος

  • Like 1
Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες
  • 0

@lennox32 Πραγματικά το DataTable δίνει πολλές δυνατότητες, αλλά λύση δεν ήταν αυτή τελικά.

Η λύση ήταν να δώσω στο td

padding1px 1px 1px 1px;
 
Ευχαριστώ όσους ασχολήθηκαν.
Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες
  • 0
5 ώρες πριν, Lanike71 είπε

@lennox32 Πραγματικά το DataTable δίνει πολλές δυνατότητες, αλλά λύση δεν ήταν αυτή τελικά.

Η λύση ήταν να δώσω στο td

padding1px 1px 1px 1px;
 
Ευχαριστώ όσους ασχολήθηκαν.

Αδερφέ κάπου αλλού ήταν το πρόβλημα καθώς τα περιμετρικά κενά 1px στο κελί δεν έχουν ιδιαίτερη σχέση αλλά χαίρομαι που το έλυσες!

  • Like 1
Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες
  • 0
4 λεπτά πριν, lennox32 είπε

Αδερφέ κάπου αλλού ήταν το πρόβλημα καθώς τα περιμετρικά κενά 1px στο κελί δεν έχουν ιδιαίτερη σχέση αλλά χαίρομαι που το έλυσες!

Δηλαδή by default όταν δημιουργείς ένα νέο απλό πίνακα με ή χωρίς bootstrap, παίρνει τις διαστάσεις που πρέπει;

 

Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες
  • 0
1 λεπτό πριν, lennox32 είπε

Δεν είπα αυτό, είπα οτι τα περιμετρικά κενά στο td είναι άσχετα με το full width responsive του table.

Ρωτάω επειδή είμαι καινούργιος σε css.

Δηλαδή σε απλή html και css, με ή χωρίς bootstrap, πώς δημιουργείται ένας πίνακας που να έχει πλάτος και ύψος, όσο τα δεδομένα του;

Έψαχνα στο stack και η λέξη που έβρισκα συνέχεια ήταν tricky, tricky, tricky, tricky...Αυτό μόνο σε css μπορεί να συμβαίνει νομίζω.

Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες

Δημιουργήστε ένα λογαριασμό ή συνδεθείτε για να σχολιάσετε

Πρέπει να είστε μέλος για να αφήσετε σχόλιο

Δημιουργία λογαριασμού

Εγγραφείτε με νέο λογαριασμό στην κοινότητα μας. Είναι πανεύκολο!

Εγγραφείτε για έναν νέο λογαριασμό

Σύνδεση

Έχετε ήδη λογαριασμό; Συνδεθείτε εδώ.

Συνδεθείτε τώρα
  • Δημιουργία νέου...

Με την περιήγησή σας στο insomnia.gr, αποδέχεστε τη χρήση cookies που ενισχύουν σημαντικά την εμπειρία χρήσης.