Βοήθεια με το σήσιμο ενος layout..

Ας μάθουμε πως να κάνουμε τις σελίδες μας με στιλ. Τα Cascading Style Sheets είναι ο τρόπος για να το επιτύχουμε.

Συντονιστές: WebDev Moderators, Super-Moderators

Απάντηση
Άβαταρ μέλους
dionisis71
Δημοσιεύσεις: 238
Εγγραφή: 04 Μάιος 2009 22:15
Επικοινωνία:

Βοήθεια με το σήσιμο ενος layout..

Δημοσίευση από dionisis71 » 20 Οκτ 2011 22:48

Kypros Lambrou έγραψε: Μου αρέσει το ερώτημα σου γιατί βασικά έρχεσαι στην συζήτηση που είχαμε με τον φίλο apsuh0s και το "παράξενο" clearfix που ίσως να σε είχε μπερδέψει στην λύση που σου είχε δώσει. Το πρόβλημα στην περίπτωση αυτή είναι ότι το πρώτο container "headerdiv" δεν παίρνει το ύψος το οποίο θα έπρεπε ανάλογα με το περιεχόμενο του, λόγω του ότι το περιεχόμενο βρίσκεται floated όπως και στην δική σου περίπτωση.

Δεν είναι αναμενόμενη συμπεριφορά αλλά ωστόσο είναι συνήθης γιαυτό και χρησιμοποιούμε τα clearfix που κάνουν το container να προσαρμοστεί στο ύψος του περιεχομένου του.
Να σου πω την αλήθεια όταν είδα αυτό το κενό το υποψιάστηκα ότι ο apsuh0s πιθανόν να το έβαλε για αυτό το λόγο. φυσικά και θα ρίξω μια ματιά στην clearfix απλά ένα-ένα γιατί θα κάψουμε κάνα εγκέφαλο...

Kypros Lambrou
Δημοσιεύσεις: 96
Εγγραφή: 17 Οκτ 2011 13:29

Βοήθεια με το σήσιμο ενος layout..

Δημοσίευση από Kypros Lambrou » 20 Οκτ 2011 22:57

Επειδή έχω δει που είπες ότι έχεις να κάνεις με αόρατα πράγματα :D όταν βρίσκεις εμπόδιο με κάτι που δεν φαίνεται όπως θα περίμενες, σου συστήνω να βάζεις διάφορα χρώματα για background στα containers σου έτσι ώστε να είσαι σίγουρος ότι το τάδε container είναι σίγουρα όπως το θέλεις. Πολλές φορές άλλα γράφουμε και άλλα κάνει :P γιαυτό μην σε παίρνει από κάτω.

Προς το παρών απλά βάλε clear:both; στο επόμενο κουτί με το περιεχόμενο και θα είσαι εντάξει.

Άβαταρ μέλους
dionisis71
Δημοσιεύσεις: 238
Εγγραφή: 04 Μάιος 2009 22:15
Επικοινωνία:

Βοήθεια με το σήσιμο ενος layout..

Δημοσίευση από dionisis71 » 20 Οκτ 2011 23:04

Kypros Lambrou έγραψε:Επειδή έχω δει που είπες ότι έχεις να κάνεις με αόρατα πράγματα :D όταν βρίσκεις εμπόδιο με κάτι που δεν φαίνεται όπως θα περίμενες, σου συστήνω να βάζεις διάφορα χρώματα για background στα containers σου έτσι ώστε να είσαι σίγουρος ότι το τάδε container είναι σίγουρα όπως το θέλεις. Πολλές φορές άλλα γράφουμε και άλλα κάνει :P γιαυτό μην σε παίρνει από κάτω.

Προς το παρών απλά βάλε clear:both; στο επόμενο κουτί με το περιεχόμενο και θα είσαι εντάξει.
Πολύ καλό αυτό με τα χρώματα, θα το ξεκινήσω ήδη, πάντως το clear:both δεν έκανε κάτι.. Αυτό που θα διόρθωνε θα ήταν το κενο που εμφανίζεται στην σελίδα μου στον designer αν κατάλαβα καλά. Θα το ξαναδώ όμως...

Kypros Lambrou
Δημοσιεύσεις: 96
Εγγραφή: 17 Οκτ 2011 13:29

Βοήθεια με το σήσιμο ενος layout..

Δημοσίευση από Kypros Lambrou » 20 Οκτ 2011 23:07

Γενικά θα διορθώσει αυτό με το clearfix. Βάλε clear:both; στο #contentdiv και φύγε τα 95px που έχει για margin-top;

Άβαταρ μέλους
dionisis71
Δημοσιεύσεις: 238
Εγγραφή: 04 Μάιος 2009 22:15
Επικοινωνία:

Βοήθεια με το σήσιμο ενος layout..

Δημοσίευση από dionisis71 » 21 Οκτ 2011 00:07

Διορθώθηκε, είχες δίκιο.. :)

Άβαταρ μέλους
apsuh0s
Script Master
Δημοσιεύσεις: 411
Εγγραφή: 01 Νοέμ 2005 21:38
Τοποθεσία: Ηράκλειο
Επικοινωνία:

Βοήθεια με το σήσιμο ενος layout..

Δημοσίευση από apsuh0s » 21 Οκτ 2011 12:04

Μη σε μπερδεύει το clearfix. Βάλε στο css σου τα properties που σου έδωσα σε προηγούμενο post για την class clearfix και εφάρμοσε την όπου έχεις container το οποίο περιέχει floated elements. Σαφέστατα υπάρχουν κι άλλοι τρόποι να πετύχεις το ίδιο αποτέλεσμα.
.ninja { color: black; visibility: hidden !important; }


Άβαταρ μέλους
dionisis71
Δημοσιεύσεις: 238
Εγγραφή: 04 Μάιος 2009 22:15
Επικοινωνία:

Βοήθεια με το σήσιμο ενος layout..

Δημοσίευση από dionisis71 » 21 Οκτ 2011 23:27

Χμμ.. απορίες έχω… αλλά προς το παρόν δεν θα κάνω καμμία ερώτηση, είμαι πολύ χαρούμενος καθώς έφτασα στο πρώτο μου μαξιλαράκι.. στόχο.. βάση, και δεν μπορώ παρά να μην σας ευχαριστήσω για το πολύτιμο σπρώξιμο που μου δώσατε. Η demo membership database μου και το demo δυναμικό μενού μου, παίζουν μια χαρά και μπορώ να χαλαρώσω ώστε να σκεφτώ τα επόμενα βήματα.. Τελικά ο χρόνος που έχω αφιερώσει (περισσότερο για ASP.NET και λιγότερο για CSS) δεν πάει χαμένος.. Όλο το καλοκαίρι με αυτά έπαιζα και με ένα μικρό σπρώξιμο μου δώσατε φτερά.. Τα χρώματα δεν με πολυνοιάζουν αυτήν την στιγμή και πιθανόν κάποια στιγμή να ξαναγυρίζω σε αυτά.. Αν σας είχα δίπλα μου θα σας πλάκωνα στα φιλιά.

Να μοιραστώ το αποτέλεσμα μαζί σας

Quest screen
http://imageshack.us/photo/my-images/3/logedout.jpg/

member screen
http://imageshack.us/photo/my-images/716/logedin.jpg/

Σας ευχαριστώ

Άβαταρ μέλους
apsuh0s
Script Master
Δημοσιεύσεις: 411
Εγγραφή: 01 Νοέμ 2005 21:38
Τοποθεσία: Ηράκλειο
Επικοινωνία:

Βοήθεια με το σήσιμο ενος layout..

Δημοσίευση από apsuh0s » 22 Οκτ 2011 02:17

Καλά όλα αυτά και μπράβο σου που είσαι ευχαριστημένος με το αποτέλεσμα. Αυτό που προτείνω είναι να ξεδώσεις όσο θέλεις στο παρόν project που κάνεις.

Ωστόσο η γνώμη μου είναι πως πρέπει να το πάρεις λίγο από την ανάποδη. Μάθε να συντάσεις σωστό, καθαρό κώδικα HTML, μετά προχώρα στην CSS και μετά όλα τα άλλα.

Αντιλαμβάνομαι πως είναι γλυκό, να δίνεις σάρκα και οστά στις δημιουργίες σου αλλά θέλει πειθαρχία για να αποκτήσεις γνώσεις. Εφόσον έχεις μια στέρεη γνώση για το ένα αντικείμενο, ευκολότερα θα αντιλαμβάνεσαι το επόμενο. Και το πρώτο αντικείμενο που πρέπει να μάθεις σωστά είναι η HTML. Τουλάχιστον γι αυτό που, όπως αντιλαμβάνομαι από τις κουβέντες μας, θέλεις να κάνεις.
.ninja { color: black; visibility: hidden !important; }

Απάντηση

Επιστροφή στο “CSS - Cascading Style Sheets”

Μέλη σε σύνδεση

Μέλη σε αυτήν τη Δ. Συζήτηση: Δεν υπάρχουν εγγεγραμμένα μέλη και 0 επισκέπτες