9Απρ

Αντιμετωπίστε το πρόβλημα του fixed height στα divs με την λύση του min-height hack.

, 9 Απριλίου 2008 | WEB DESIGN - AUTHORING | 0 Σχόλια

Ένα συχνό πρόβλημα που αντιμετωπίζουν οι web designers όταν μεταβούν από table based authoring σε divs (layers authoring) είναι το θέμα με το fixed height (συγκεκριμένο ύψος). Ουσιαστικά το πρόβλημα εντοπίζεται όταν οριστεί συγκεκριμένο ύψος height σε κάποιο div με αποτέλεσμα αντί να κάνει «expand» και να φιλοξενήσει το περιεχόμενο, λειτουργεί λανθασμένα (overlap) αλλοιώνοντας το layout της ιστοσελίδας.

Για το θέμα του fixed height υπάρχει η λύση του min-height hack, αναλυτικότερα:

Δείγμα προβλήματος | Δείγμα με εφαρμογή του min-height hack

CSS ΚΩΔΙΚΑΣ ΠΟΥ ΠΡΕΠΕΙ ΝΑ ΕΦΑΡΜΟΣΟΥΜΕ

#name_div {
min-height:500px;
height:auto !important;
height:500px;
}

Το min-height hack δουλεύει σε όλα τα βασικά προγράμματα πλοήγησης διαδικτύου (browsers) όπως IE6+, Mozilla/Firefox/Gecko, Opera 7.x+, Safari1.2+ και είναι έγκυρο (valid) για τα παγκόσμια πρότυπα W3C.

ΧΡΗΣΙΜΗ ΠΛΗΡΟΦΟΡΙΑ: Το άρθρο Αντιμετωπίστε το πρόβλημα του fixed height στα divs με την λύση του min-height hack. γράφτηκε από το WebDesignBlog. Η ομάδα μας σας υπενθυμίζει πως αν θέλετε να ενημερώνεστε για τα νέα του διαδικτύου και για επιλεγμένα άρθρα μας, μπορείτε να γραφτείτε εύκολα στο Newsletter μας ή στο RSS Feed μας.

Σχολιάστε

Back to top

Recent comments

  • Πολυ καλο αθρο πραγματικα!

    Η σωστή αρχιτεκτονική ενός website και τα οφέλη της
  • Πολύ χρήσιμη η λίστα με τα online tools. Ο επιτυχημένος σχεδιασμός μιας ιστοσελίδας βοηθά σε δύο κατευθύνσεις. Η πρώτη είναι ότι βελτιώνει την εμπειρία του επισκέπτη της ιστοσελίδας με συνέπεια ο τελευταίος να βλέπει περισσότερες σελίδες και να μένει περισσότερο χρόνο σε αυτή. Η δεύτερη είναι ότι επειδή ακριβώς βελτιώνονται τα στατιστικά στοιχεία της ιστοσελίδας, όπως το bounce rate, ο μέσος χρόνος παραμονής στην ιστοσελίδα και ο αριθμός των σελίδων ανά επίσκεψη, βελτιώνεται και η κατάταξη της ιστοσελίδας στα οργανικά αποτελέσματα της Google.

    10+1 Χρήσιμα website και on line tools

Latest From Twitter