Προς το περιεχόμενο

μια ερωτησούλα css


ata1983

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

Δημοσ.

Καλησπέρα παιδιά, έχω μια ερωτησούλα.

Έχω σε ένα site που κάνω για εργασία τα εξής div: navbar, content, leftsidebar και rightsidebar.

Όλα είναι στη θέση τους εκτός από τη leftsidebar που θέλω να μπεί κάτω από την navbar στα αριστερά της σελίδας(Η navbar ειναι το menu πλοήγησης και έχει κάθετο προσανατολισμό). Την κάνω float left και μου την πάει δεξιά της navbar και όχι από κάτω της. Την κάνω position relative και δεν γίνεται τπτ. Γιατί?

Ο μόνος τρόπος είναι να την κάνω position absolute να πέσει πάνω στην navbar και μετά να παίξω με το padding-top για να κατέβει αλλά μου κάνει λίγο μπακαλίστικο, δεν ξέρω κιόλας! Καμιά ιδέα?

 

Ξέρω θα βοηθούσε το site αλλά είναι για την διπλωματική μου και δεν μπορώ να βάλω εδώ link, σορρυ θα σας παιδέψω λίγο παραπάνω αλλά νομίζω είναι πολύ κοινότυπο αυτό που θέλω να κάνω και θα την πιάσετε τη μορφή.

Ευχαριστώ

Δημοσ.

κάνε clear:left στο leftsidebar

Πιο σωστό ίσως να είναι για τα menu που θα έχεις δεξιά να έχεις ένα div με float:left και μέσα σε αυτό να χώσεις να δυο (navbar και leftsidebar)

Δημοσ.

Πιο σωστό ίσως να είναι για τα menu που θα έχεις δεξιά να έχεις ένα div με float:left και μέσα σε αυτό να χώσεις να δυο (navbar και leftsidebar)

 

Ναι ξέχασα να πώ αυτό το δοκίμασα αλλά για κάποιο λόγο δεν δούλευε τα link στην navbar και δεν το πολυέψαξα μετά.

 

Edit: Δοκίμασα το clear:left και δουλεύει μια χαρά. Ευχαριστώ. Τι κάνει ακριβώς αυτή η εντολή? Εννοώ είμαι οκ τώρα ή είναι και αυτό κάποιο τρικ για να μου βγεί?

Δημοσ.

Έχει σημασία η σειρά με την οποία είναι γραμμένα τα divisions στον κώδικα. Θα τα έγραφα navbar, leftsidebar, content, rightsidebar.

Δημοσ.

Ρε γμτ όποιο τρόπο και αν κάνω μόλις πάει στη σωστή θέση η left sidebar κατεβαίνει μαζι τους και το content και η rightsidebar. Υπάρχει κάποιος λόγος? Όλα αυτά είναι σε ξεχωριστά div

Δημοσ.

Βασικά γίνεται με διάφορους τρόπους (ακόμα και με margin/padding αντί για float).

 

Δες ένα παράδειγμα...

><html><head><title>Untitled</title></head><body>
<div style="background-color:pink;">navbar</div>
<div style="background-color:red;float:left;width:10%;height:300px">leftbar</div>
<div style="background-color:green;float:left;clear:none;width:80%;height:300px">content</div>
<div style="background-color:blue;float:left;width:10%;height:300px">sidebar</div>
</body></html>

Δημοσ.

χμ δεν ξέρω τι κάνω λάθος, ευχαριστώ. Βάζω εδώ λίγο κώδικα

>
<div id="navbar">

..............................code.............................

</div>
		{if $leftSidebarCode}


		<div id="leftSidebar">
			{$leftSidebarCode}
		</div>
	{/if}


	{if $rightSidebarCode}
		<div id="rightSidebar">
			{$rightSidebarCode}
		</div>
	{/if}


<div id="content">

 

 

Το content div κλείνει σε άλλο αρχείο smarty κώδικα και εμπλεξα όταν πήγα να τα βάλω στη σειρά που μου είπες αλλά και πάλι δε νομίζω να είναι αυτό έχω πιο χροντρό πρόβλημα

 

---------- Το μήνυμα προστέθηκε στις 18:33 ----------

 

Ξέχασα το css κώδικα

>
#navbar {
margin-right: 0;
padding-bottom: 0em;
width: 175px;
float: left;

#content {
width:653px;
margin: 0;
padding: 0;
font-size: 0.7em;
float: right;

#rightSidebar a { font-family:Arial; font-size:100%; }
#rightSidebar { margin-right:1%; margin-top:10px; width:252px; }
#rightSidebar { margin:0px; padding:0px;width:252px; float:right; margin-bottom:2em;margin-top:1em;font-size:0.85em; }
#rightSidebar { margin-top:0px; }


#leftSidebar a { font-family:Arial; font-size:100%; }
#leftSidebar { margin-right:1%; margin-top:10px; width:175px; }
#leftSidebar { margin:0px; padding:0px;width:175px; float:left; margin-bottom:2em;margin-top:1em;font-size:0.85em; }
#leftSidebar { margin-top:0px; }





Δημοσ.

Το χοντρό πρόβλημα είναι πως τα έχεις μπερδέψει, αυτό που έχεις γράψει δεν έχει κανένα νόημα (και μην ορίζεις ένα property πάνω από μία φορά για το ίδιο id).

 

Σώσε κάπου αυτό που σου έδωσα παραπάνω και άνοιξέ το να δεις πώς φαίνεται.

Αρχειοθετημένο

Αυτό το θέμα έχει αρχειοθετηθεί και είναι κλειστό για περαιτέρω απαντήσεις.

  • Δημιουργία νέου...