Border Width

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

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

Απάντηση
Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8575
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

Border Width

Δημοσίευση από Basilakis » 03 Σεπ 2009 12:54

έχω το παρακάτω tiny tiny προβληματάκι, αλλα δεν βρήσκω λύση και σε μια αναζήτησή μου :oops: :oops: :oops:

Εικόνα

θέλω να το κάνω

Εικόνα


Μπορώ να παίξω με border image αλλα είναι πολύ CSS3 και δεν θέλω να βιαστώ για κάτι τέτοιο...

Άβαταρ μέλους
Sermac
Δημοσιεύσεις: 363
Εγγραφή: 26 Σεπ 2007 21:08

Border Width

Δημοσίευση από Sermac » 03 Σεπ 2009 13:37

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

<!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" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-7" />
<meta http-equiv="Content-Language" content="el" />
<title>border margin</title>
<style type="text/css">
* &#123;
    margin&#58;0;
    padding&#58;0;
&#125;

#area &#123;
    width&#58;400px;
    border-right&#58;1px dashed #CCC;
    padding-left&#58;10px;
&#125;

#area-inner &#123;
    border-bottom&#58;1px dashed #CCC;
    margin-right&#58;20px;
    padding&#58;10px 0;
&#125;
</style>
</head>
<body>
    <div id="area">
        <div id="area-inner">
            <h2>This is news test</h2>
            <br />
            This is news test
        </div>
    </div>
</body>
</html>
:whistle:
Εικόνα

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8575
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

Border Width

Δημοσίευση από Basilakis » 03 Σεπ 2009 13:50

Δεν μπορεί να παίξει σωστά αυτό :)

Βλέπεις το

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

    <div id="area">
        <div id="area-inner">
            <h2>This is news test</h2>
            <br />
            This is news test
        </div>
    </div> 
είναι έτσι

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

    <div id="area">
        <div id="area-inner">
            <div id="area-inner2"><h2>This is news test</h2></div>
            <br />
            This is news test
        </div>
    </div> 

Άβαταρ μέλους
Sermac
Δημοσιεύσεις: 363
Εγγραφή: 26 Σεπ 2007 21:08

Border Width

Δημοσίευση από Sermac » 03 Σεπ 2009 14:16

Εικόνα

Δεν καταλαβαίνω την διαφορά. :oops: Το area-inner2 έχει κάποιο δικό του style;
Εικόνα

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8575
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

Border Width

Δημοσίευση από Basilakis » 03 Σεπ 2009 14:17

Μάλλον εδώ είπα χαζομάρα, έβγαλα άκρη οκ, thank u a lot :)

mariosal
Honorary Member
Δημοσιεύσεις: 1473
Εγγραφή: 09 Νοέμ 2007 23:55

Border Width

Δημοσίευση από mariosal » 03 Σεπ 2009 18:44

Ένας τρόπος θα ήταν να δώσεις μικρότερο width στο border-bottom

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8575
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

Border Width

Δημοσίευση από Basilakis » 03 Σεπ 2009 18:47

ναι μάριε μου; Και για πες μου πως γίνεται αυτό;

mariosal
Honorary Member
Δημοσιεύσεις: 1473
Εγγραφή: 09 Νοέμ 2007 23:55

Border Width

Δημοσίευση από mariosal » 03 Σεπ 2009 18:52

Ωχ ναι συγγνώμη. Με margin όπως σου έδειξε ο Sermac γίνεται. Και εγώ αυτό το πρόβλημα είχα και το είχα λύσει με margin :oops:

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8575
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

Border Width

Δημοσίευση από Basilakis » 03 Σεπ 2009 19:01

Ωχ ναι πως σου ξέφυγε!

Άβαταρ μέλους
dimsis
Reporter
Δημοσιεύσεις: 7994
Εγγραφή: 25 Ιούλ 2001 03:00

Border Width

Δημοσίευση από dimsis » 03 Σεπ 2009 21:36

Αν έβαζες μόνο border-right στο div με το κείμενο και από κάτω έβαζες ένα άλλο div με border-top και μικρότερο width δεν καθόταν σωστά; δεν το δοκίμασα αλλά όπως το βλέπω αυτό ήταν το πρώτο που μου ήρθε στο μυαλό

Άβαταρ μέλους
Basilakis
PHP Moderator
Δημοσιεύσεις: 8575
Εγγραφή: 17 Νοέμ 2003 13:03
Τοποθεσία: Womans' Brain
Επικοινωνία:

Border Width

Δημοσίευση από Basilakis » 03 Σεπ 2009 21:46

Αυτό έκανα αλλα ανάποδα ;)

Έβαλα στο border του κειμένου border-bottom Και έβαλα απο γύρω ένα άλλο div με το αλλο μου το border :)

Απάντηση

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

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

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