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

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

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

  • 0
mixalis8

Βοήθεια με CSS

Ερώτηση

deite ton parakato kodika kai peite mou ti prepei na kano etsi oste otan dimiourgeite nea seira na emfanizetai kato apo tin proigoumeni kai oxi na "mpainei" opou xoraei ena neo proion...

 

 

an anoiksete ton kodika me browser tha katalabete ti ennoo...

 

 

>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#subcategories li {
display: inline;
list-style-type: none;
}
#subcategories ul {
margin: 0px;
padding: 0px;
}
#item {
display: block;
}
#all {
width: 560px;
float: left;
}
#all #subcategories #item {
margin: 5px;
float: left;
width: 168px;
}
-->
</style>
</head>

<body>
<div id="all">
<div id="subcategories">
 
   <ul>
     <div id="item"><li>
       <h2>Σχολικά Βιβλία</h2>
       <span class="comments">Όλα τα σχολικά βιβλία σε χαμηλές τιμές        </span>
       hbbjhbkjhb kjb
       uihoiuhergoiuhwer oiugwhergiouehrgio uehrw oweirughriougehrwoig uwher ogiuehrgiouerh wiuerhgoireuhg oeiwhug eiorh
       <div align="center"></div>
     </li>
     </div>
  <div id="item"><li>
       <h2>Λογοτεχνικά</h2>
       <span class="comments">Όλα τα σχολικά βιβλία σε χαμηλές</span>
       <div align="center"></div>
     </li>
     </div>
     <div id="item"><li>
       <h2>Βοηθήματα</h2>
       <span class="comments">Όλα τα σχολικά βιβλία σε χαμηλές τιμές        </span>
       <div align="center"></div>
     </li>
     </div>
     <div id="item"><li>
       <h2>Φυσικής</h2>
       <span class="comments">Όλα τα σχολικά βιβλία σε χαμηλές τιμές        </span>
       <div align="center"><img src="images/tempitem.png" width="138" height="146" />          </div>
     </li>
     </div>
   </ul>
   
 </div>
</div>
</body>
</html>

Κοινοποιήστε αυτήν την ανάρτηση


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

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

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

euxaristo file mou pou asxoleise me to thema mou alla mallon akoma den lithike to problima....

des ebala mia fotografia kai to 4o pihe kato apo to 2o kai to 5o kato apo to 3o ano tha eprepe to 4o kato apo to 1o kai to 5o kato apo to 2o....

 

kati allo simbainei kai den mporo na katalabo ti....

Κοινοποιήστε αυτήν την ανάρτηση


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

Χμ, αυτό δυστυχώς για να το κάνεις δεν γίνεται με τον κώδικα που μας έδωσες. Στο έφτιαξα αυτό που θές με δικό μου παράδειγμα. Μπορείς να το προσαρμόσεις σε αυτό που θες και θα είναι ΟΚ:

 

>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Untitled Document</title>

<style type="text/css">

#wrapper
{
border: 1px solid black;
width:  100px;
}

#items_wrapper ul
{
list-style: none;
padding: 0;
margin: 0;
}

#items_wrapper li
{
float: left;
width: 10px;
}

br
{
  clear: left;
}
 
</style>

</head>

<body>

<div id="wrapper">
<div id="items_wrapper">
	<ul>
	<li><a href="#">Item 1</a></li>
	<li><a href="#">Item 2</a></li>
	<li><a href="#">Item 3</a></li>
	<li><a href="#">Item 4</a></li>
	<li><a href="#">Item 5</a></li>
	</ul>
</div>
<br />
</div>

</body>
</html>

Κοινοποιήστε αυτήν την ανάρτηση


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

Nai... kano refresh gia tin cache... to zitima einai oti to Φυσική pigainei kato apo tin deuteri stil kai oxi kato apo tin proti stili epeidi to ipsos tous protou dimiourgei problima...

 

palia ekana kati kai diorthonotan alla tora den mporo na to thimitho...

 

thelo diladi na dimiourgithi kati san pinakas....

 

44-Picture 1.png

 

tha eprepe to fisiki na einai kato apo ta sxolika

Κοινοποιήστε αυτήν την ανάρτηση


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

Ένας από τους τρόπους για να κάνεις αυτό με τα columns είναι αυτός που σου έδειξα πάντως, απλά θα πρέπει να προσαρμόσεις τα widths ανάλογα. Εσύ θα χρειαστεί να τα μεγαλώσεις και αρκετά μάλιστα αν κρίνω από την φωτογραφία που έχεις κάνει attach.

 

Δοκίμασε να τον τρέξεις αυτούσιο για να δεις ότι η συμπεριφορά είναι αυτή που θές

Κοινοποιήστε αυτήν την ανάρτηση


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

Το λάθος σου είναι στο

 

>
<div id="item"></div>

 

Το "id" χρησιμοποιείται για να δηλώσεις κάτι μοναδικό μέσα στο document. Από την στιγμή που έχεις πολλά items θα πρέπει να χρησιμοποιήσεις class οπότε θα χρειαστεί να αλλάξεις όλα τα

 

>
<div id="item"></div> 

 

σε

 

>
<div class="item"></div> 

 

και στην CSS να αλλάξεις το

 

>
#item {
display: block;
}

 

σε

 

>
.item {
display: block;
}

 

Ο νέος κώδικας:

 

>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Untitled Document</title>
<style type="text/css">
<!--
#subcategories li {
display: inline;
list-style-type: none;
}
#subcategories ul {
margin: 0px;
padding: 0px;
}
.item {
display: block;
}
#all {
width: 560px;
float: left;
}
#all #subcategories #item {
margin: 5px;
float: left;
width: 168px;
}
-->
</style>
</head>

<body>
<div id="all">
<div id="subcategories">
 
   <ul>
     <div class="item"><li>
       <h2>Σχολικά Βιβλία</h2>
       <span class="comments">Όλα τα σχολικά βιβλία σε χαμηλές τιμές        </span>
       hbbjhbkjhb kjb
       uihoiuhergoiuhwer oiugwhergiouehrgio uehrw oweirughriougehrwoig uwher ogiuehrgiouerh wiuerhgoireuhg oeiwhug eiorh
       <div align="center"></div>
     </li>
     </div>
  <div class="item"><li>
       <h2>Λογοτεχνικά</h2>
       <span class="comments">Όλα τα σχολικά βιβλία σε χαμηλές</span>
       <div align="center"></div>
     </li>
     </div>
     <div class="item"><li>
       <h2>Βοηθήματα</h2>
       <span class="comments">Όλα τα σχολικά βιβλία σε χαμηλές τιμές        </span>
       <div align="center"></div>
     </li>
     </div>
     <div class="item"><li>
       <h2>Φυσικής</h2>
       <span class="comments">Όλα τα σχολικά βιβλία σε χαμηλές τιμές        </span>
       <div align="center"><img src="images/tempitem.png" width="138" height="146" />          </div>
     </li>
     </div>
   </ul>
   
 </div>
</div>
</body>
</html>

Κοινοποιήστε αυτήν την ανάρτηση


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

Η θα πρεπει να δηλωσεις standard heights στα divs, ή

height: auto

ή να χρησιμοπιησεις pseudo-classes, αλλιως παμε σε CSS3, τα οποια παιζει μονο ο Opera και ο Safari.

Για να βοηθησω ή να σου δωσω ακριβη κωδικα,πρεπει να καταλαβω ΑΚΡΙΒΩΣ τι θελεις να κανεις και με με βαση ποιες παραμετρους θες να ειναι τροποιησιμο. Εννοω οτι μπορει να κανουμε κατι, αλλα ανα θες να προσθεσεις καμια εικονα ή μεγαλο κειμενο, να "σπασει".

Κοινοποιήστε αυτήν την ανάρτηση


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

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

 

YΓ: Είσαι σίγουρος ότι βλέπεις τα αποτελέσματα των καινούριων αλλαγών στο CSS και όχι αυτά που είχε κρατήσει η cache του browser; Απλά ρωτάω για να ξέρω ότι βλέπουμε τα ίδια (δηλαδή ακριβώς την συμπεριφορά που έχει μια ordered list από μόνη της).

Κοινοποιήστε αυτήν την ανάρτηση


Σύνδεσμος στην ανάρτηση
Κοινοποίηση σε άλλες σελίδες
×
×
  • Δημιουργία νέου...