Archief - CSS: double border

Zeppelin · 29 jul 2005

Hello

K vroeg mij af of het mogelijk is om twee borders te maken in css, waarbij de buitenste border zwart is en de binnenste border een grijsachtige kleur heeft.

Heb al zelf geprobeerd en google heeft ook ni echt geholpe, probleem is dat em automatisch die 2 borders boven elkaar plaatst. Is er n css element waarbij ge ne pixel er kunt tusse late ofzo?

Alvast bedankt

gille · 29 jul 2005

maak de bovenste een 1px border en de onderste een 2px border?

Zeppelin · 29 jul 2005

Nope, bedoeling is dat die border rond heel de site komt. Kan wel ewa CSS ma ng ni volledig dus ni op de eventuele nooby foute lette

CSS

Code:

.border1{
border-style:solid;
border-color:#000000;
border-width:1px;
}
.border2{
border-style:solid;
border-color:#CDCDCD;
border-width:2px;
}

Beetje duidelijker?

En dit is de tabel

Code:

<table width="50%"  border="0" cellspacing="0" cellpadding="0" align="center" class="border2" class="border1">
  <tr>
    <td>Test</td>
    <td>Test</td>
  </tr>
  <tr>
    <td>Test</td>
    <td>Test</td>
  </tr>
</table>

Viper5000 · 29 jul 2005

eenzelfde element kan geen twee borders hebben, dus je zal 2 elementen nodighebben (bv een <div> rond je tabel met padding=afstand tussen je borders en border=je buitenste border)

wat ook nog handig kan zijn is de korte notatie voor border (css wordt er overzichtelijker door vind ik, maar dat is natuurlijk mijn mening)
border-style

olid;
border-color:#CDCDCD;
border-width:2px;
wordt dan
border: 2px solid #CDCDCD;

Fr3aK · 29 jul 2005

Viper5000 zei:
eenzelfde element kan geen twee borders hebben, dus je zal 2 elementen nodighebben (bv een <div> rond je tabel met padding=afstand tussen je borders en border=je buitenste border)

wat ook nog handig kan zijn is de korte notatie voor border (css wordt er overzichtelijker door vind ik, maar dat is natuurlijk mijn mening)
border-styleolid;
border-color:#CDCDCD;
border-width:2px;
wordt dan
border: 2px solid #CDCDCD;

Ge kunt nen dubbelen border hebben maar dee heeft dan maar één kleur:

Code:

border: 1px double #000000;

Obliv` · 29 jul 2005

aangezien ge met tables werkt, doe het dan zo:

HTML

Code:

<table id="buitenBorder" border="0" cellpadding="0" cellspacing="0">
    <tr>
        <td>
            <table id="binnenBorder" border="0" cellpadding="0" cellspacing="0">
                <tr>
                    <td><!-- HIER KOMT DE CONTENT --></td>
                </tr>
            </table>
        </td>
    </tr>
</table>

CSS

Code:

table#buitenBorder
{
    border: 1px solid #000000;
}

table#binnenBorder
{
    border: 1px solid #CCCCCC;
}

er kunnen wel typfouten inzitten.. groeten

Viper5000 · 29 jul 2005

Fr3aK zei:
Ge kunt nen dubbelen border hebben maar dee heeft dan maar één kleur:

Code:

border: 1px double #000000;

ja maar dat vroeg hij duidelijk niet :ironic:

trouwens, het blijft 1 border zelfs al is het een dubbele

Zeppelin · 29 jul 2005

Yup da heeft t em gedaan thnx!!

K veronderstel da ge # voor uw css-elementen gebruikt om te gebruiken in de id-tag? Wa is kunde het best gebruike dan eigelek, ID of CLASS? Of is het specifiek vr n bepaald doel?

Nogmaals bedankt
Groetjes

DarkBone · 29 jul 2005

id="test1" -> mag maar 1 maal gebruikt worden op de pagina (bij 1 element dus)
class="test2" -> mag meedere malen voorkomen op de pagina en door meerdere elementen

#test1 -> dit is dus opmaak die maar 1 maal mag gebruikt worden op de pagina, aangezien het maar van toepassing is op 1 plaats en 1 element, welk element dat is doet er niet toe natuurlijk
.test2 -> kan door alle elementen op de pagina gebruikt worden, is een opmaak die dus verschillende keren mag gebruikt worden

Archief - CSS: double border

Zeppelin

Legacy Member

gille

Legacy Member

Zeppelin

Legacy Member

Viper5000

Legacy Member

Fr3aK

Legacy Member

Obliv`

Legacy Member

Viper5000

Legacy Member

Zeppelin

Legacy Member

DarkBone

Legacy Member