Άλλη μια διαφωνία ie και mozilla

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

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

Απάντηση
nikpony
Δημοσιεύσεις: 104
Εγγραφή: 12 Ιούλ 2006 02:58

Άλλη μια διαφωνία ie και mozilla

Δημοσίευση από nikpony » 16 Ιαν 2009 01:06

Καλησπέρα σας,
Έχω φτιάξει ένα πίνακα στον οποίο έχω βάλει το ακόλουθο css

border-top-style: none;
border-bottom-style: solid;
border-bottom-color: #6699FF;
border-bottom-width: thin;
border-collapse: collapse;
border-right-style: solid;
border-left-style: none;
vertical-align: bottom;
border-top-color: #ffffFF;
border-left: medium solid #ffffff;
border-right: medium solid #ffffff;

Και στον internet explorer μου το εμφανίζει όπως στην εικόνα που σας επισυνάπτω, ενώ στον mozilla μου τον εμφανίζει χωρίς τη μεσαία γραμμή. Εγώ όμως θέλω να φαίνεται και στον mozilla με τη μεσαία γραμμή. Αν αλλάξω το χρώμα στο border-right και βάλω π.χ. ένα μαύρο χρώμα θα μου εμφανίσει και δεξιά μια μαύρη στήλη, πράγμα που δε θέλω να συμβαίνει.

Άβαταρ μέλους
EneMe
Super Moderator
Δημοσιεύσεις: 13307
Εγγραφή: 09 Ιούλ 2002 13:29
Τοποθεσία: Στο κέντρο της Ελλάδας!
Επικοινωνία:

Άλλη μια διαφωνία ie και mozilla

Δημοσίευση από EneMe » 16 Ιαν 2009 09:41

Δεν βλέπω καμία εικόνα!

Μήπως πριν πατήσεις το "Αποστολή", ξέχασες να πατήσεις το "Add attachment";

nikpony
Δημοσιεύσεις: 104
Εγγραφή: 12 Ιούλ 2006 02:58

Άλλη μια διαφωνία ie και mozilla

Δημοσίευση από nikpony » 16 Ιαν 2009 11:25

Σήμερα το πρωί που ξύπνησα θυμήθηκα ότι δεν είχα κάνει attach την εικόνα.
Τώρα οκ.
Συνημμένα
table.JPG

Άβαταρ μέλους
manolism
Super Moderator
Δημοσιεύσεις: 6652
Εγγραφή: 25 Ιαν 2004 16:01
Τοποθεσία: Wild West
Επικοινωνία:

Άλλη μια διαφωνία ie και mozilla

Δημοσίευση από manolism » 16 Ιαν 2009 11:54

Γεια σου Νίκο. Για δοκίμασε τον παρακάτω κώδικα και πες.

Κώδικας: Επιλογή όλων

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http&#58;//www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http&#58;//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">
table.sample &#123;
	border-width&#58; medium;
	border-spacing&#58; 0px;
	border-style&#58; solid;
	border-color&#58; #6699ff;
	border-collapse&#58; collapse;
	background-color&#58; #ffffff;
&#125;
table.sample th &#123;
	border-width&#58; thin;
	border-style&#58; solid;
	border-color&#58; #6699ff;
	background-color&#58; #ffffff;
	padding&#58;10px;
&#125;
table.sample td &#123;
	border-width&#58; thin;
	border-style&#58; solid;
	border-color&#58; #6699ff;
	background-color&#58; #ffffff;
	padding&#58;10px;
&#125;
</style>
</head>

<body>


<table class="sample">
<tr> 
	<td>Content</td>
	<td>Content</td>
</tr>
</table>
</body>
</html>

nikpony
Δημοσιεύσεις: 104
Εγγραφή: 12 Ιούλ 2006 02:58

Άλλη μια διαφωνία ie και mozilla

Δημοσίευση από nikpony » 16 Ιαν 2009 14:05

Γεια σου Μανώλη.
Με τον κώδικα σου μου εμφανίζει όλες τις κάθετες γραμμές και στους δύο browsers.
Δηλαδή αριστερά, δεξιά και μεσαία. Εγώ θέλω μόνο τη μεσαία να βλέπω.
Στον explorer το είχα καταφέρει έτσι όπως το έχω κάνει εγώ αλλά στον firefox δεν θέλει...

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Άλλη μια διαφωνία ie και mozilla

Δημοσίευση από korgr » 16 Ιαν 2009 20:18

Νομίζω πως αυτό που ζητάς είναι άτοπο εξ ορισμού. Δεν γίνεται με ένα rule σε left-right boxes
Μην κοιτάς τι κάνει ο ΙΕ, ο FF πολύ σωστά τα ερμηνεύει και στα δείχνει!
Για να το πετύχεις αυτό που θες πρέπει να έχεις 3 rules
1 για το table
1 για όλα τα left cells
και 1 για όλα τα right-cells

Κώδικας: Επιλογή όλων

.theTable&#123;
padding&#58; 0;
margin&#58; 0;
border-style&#58; solid none none none;
border-color&#58; #6699FF;
border-width&#58; thin;
&#125;
.theLeftCell &#123;
vertical-align&#58; bottom;
border-style&#58; none none solid none;
border-color&#58; #6699FF;
border-width&#58; thin;
&#125;
.theRightCell&#123;
vertical-align&#58; bottom;
border-style&#58; none none solid solid;
border-color&#58; #6699FF;
border-width&#58; thin;
&#125;

Κώδικας: Επιλογή όλων

<table class="theTable" cellpadding="3" cellspacing="0">
<tr>
<td class="theLeftCell">περιεχόμενα left</td>
<td class="theRightCell">περιεχόμενα right</td>
</tr>
....
</table>

Άβαταρ μέλους
korgr
Honorary Member
Δημοσιεύσεις: 5067
Εγγραφή: 07 Οκτ 2008 18:30
Τοποθεσία: Corinth
Επικοινωνία:

Άλλη μια διαφωνία ie και mozilla

Δημοσίευση από korgr » 16 Ιαν 2009 20:27

Επίσης αν έχεις πιο πολλές στήλες χρησιμοποιείς μόνο στην πρώτη το .theLeftCell και σε όλες τις υπόλοιπες το .theRightCell

Απάντηση

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

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

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