Toon posts:

[CSS] Border :S

Pagina: 1

Acties:

105 views sinds 30-01-2008

donderdag 19 juni 2003 23:19

Acties:

Verwijderd

Topicstarter

Ik mis bij devolgende code een border om childDiv en childDiv2... Ik zit hier nu al tijden op te knagen en ik kom er maar niet uit. Ik heb de search al gebruikt, maar die heeft me niet kunnen helpen. Hier kan je zien wat ik bedoel.
WAT DOE IK FOUT??
Hier kan je de page zien: http://members.home.nl/mariusjansen/parent.php

code:

<HTML>
<HEAD>
<TITLE>Test</TITLE>

<style type="text/css">

#parentDiv{
border:solid 1px black;
position:relative;
padding:0px;
top:1%;
width:700px;
left: 50%;
margin-left: -350px;
background-color:lightblue;
}

#Header     {
margin:0px 0px 0px 0px;
padding:13px 0px 10px 10px;
height:40px;
border-style:solid;
width:700px;
border-color:black;
border-width:0px 0px 1px 0px ;
line-height:11px;
background-color:#eee;
}

#childDiv  {
padding:0px;
position:absolute; 
width:200px;
height:300px;
background-color:white;
}

#childDiv2 {
width:501px;
left: 200px;
position:absolute;
border:solid;
border-width:0px 0px 0px 1px;
height:590px;
border-color:black;
background-color:white;
}

#Menu     {
position:absolute;
top:20px;
left:14px;
width:170px;
padding:10px;
background-color:#eee;
border-top:1px solid #999;
border-right:1px solid #999;
border-bottom:1px solid #999;
border-left: 1px solid #999;
line-height:17px;
}

#Footer   {
border-style:solid;
border-color:black;
border-width:1px 1px 1px 1px;
position:relative;
width:700px;
height:40px;
line-height:11px;
left: 50%;
margin-left: -350px;
background-color:#eee;
padding:13px 0px 10px 10px;
}

body {
margin:0px 0px 0px 0px;
padding:0px;
font-family:verdana, arial, helvetica, sans-serif;
color:#333;
background-color  :white;
font:11px/20px verdana, arial, helvetica, sans-serif;
}

h1 {
margin:0px 0px 15px 0px;
padding:0px;
font-size:24px;
line-height:28px;
font-weight:900;
color:#ccc;
}
    
</style>
</head>
<body>

<DIV ID="parentDiv">
<DIV ID="Header"><SPAN ID="titel">HEADER</SPAN></A> </DIV>

<DIV ID="childDiv">
<H1>childDiv</H1>
</DIV>

<DIV ID="childDiv2">

<H1>childDiv2</H1><P></P>
</DIV>
</DIV>
</body>
</html>

Hoop dat de rotzooi nu wat minder erg is...

[ Voor 18% gewijzigd door Verwijderd op 19-06-2003 23:31 . Reden: Rotzooi opruimen :) ]

donderdag 19 juni 2003 23:23

Acties:

Batsies

E-Developing

Wat een rotzooi, zorg ervoor eerst alles goed uit te lijnen en dit hoort trouwens bij de buren!, maar wact dacht je van een border erin gooien?

E-Developing

donderdag 19 juni 2003 23:26

Acties:

Verwijderd

Topicstarter

Ja, idd een rotzooi... Sorry, ik zie dat nu pas...
Ik wil dus een border van de parent hebben. En die heb ik wel aangemaakt.
border:solid 1px black;

Ik wil dus niet de border van de childDiv en childDiv2 gebruiken, omdat ik dan met problemen kom te zitten als de ene childDiv groter wordt dan de ander. Dan sluit dat onderin niet meer mooi aan.

donderdag 19 juni 2003 23:36

Acties:

DinX

Motormuis

HTML:

<HTML>
<HEAD>
<TITLE>Test</TITLE>

<style type="text/css">
    #parentDiv{
        border:solid 1px black;
        position:relative;
        padding:0px;
        top:1%;
        width:700px;
        left: 50%;
        margin-left: -350px;
        background-color:lightblue;
    }
    
    #Header{
        margin:0px 0px 0px 0px;
        padding:13px 0px 10px 10px;
        height:40px;
        border-style:solid;
        width:700px;
        border-color:black;
        border-width:0px 0px 1px 0px ;
        line-height:11px;
        background-color:#eee;
    }
    
    #childDiv{
        padding:0px;
        position:absolute; 
        width:200px;
        height:300px;
        background-color:white;
    }
    
    #childDiv2{
        width:501px;
        left: 200px;
        position:absolute;
        border:solid;
        border-width:0px 0px 0px 1px;
        height:590px;
        border-color:black;
        background-color:white;
    }
    
    #Menu{
        position:absolute;
        top:20px;
        left:14px;
        width:170px;
        padding:10px;
        background-color:#eee;
        border-top:1px solid #999;
        border-right:1px solid #999;
        border-bottom:1px solid #999;
        border-left: 1px solid #999;
        line-height:17px;
    }
    
    #Footer{
        border-style:solid;
        border-color:black;
        border-width:1px 1px 1px 1px;
        position:relative;
        width:700px;
        height:40px;
        line-height:11px;
        left: 50%; /* Centreer-truc */
        margin-left: -350px; /* Centreer-truc, - ( width gedeeld door 2 )*/
        background-color:#eee;
        padding:13px 0px 10px 10px;
    }
    
    body {
        margin:0px 0px 0px 0px;
        padding:0px;
        font-family:verdana, arial, helvetica, sans-serif;
        color:#333;
        background-color  :white;
        font:11px/20px verdana, arial, helvetica, sans-serif;
    }

    h1 {
        margin:0px 0px 15px 0px;
        padding:0px;
        font-size:24px;
        line-height:28px;
        font-weight:900;
        color:#ccc;
    }
    
</style>
</head>

<body>
    <DIV ID="parentDiv">
        <DIV ID="Header">
            <SPAN ID="titel">HEADER
            </SPAN></A> 
        </DIV>

        <DIV ID="childDiv">
            <H1>childDiv</H1>
        </DIV>

        <DIV ID="childDiv2">
            <H1>childDiv2</H1><P></P>
        </DIV>
    </DIV>
</body>
</html>

Misschien iets leesbaarder zo

Ik ga nu even de code bekijken, maar wat doet die </A> daar zo alleen op regel 100 ?

Marokko 2015: Route
Sat Tracker: SpotWalla
Blog: Gone for a ride

donderdag 19 juni 2003 23:38

Acties:

Verwijderd

Topicstarter

Hey bedankt!

Zekerder leesbaarder zo. Handig die nummertjes ervoor.

Die </A> was van een link die ik weer heb weggehaald. Kan ook niet het probleem zijn.

donderdag 19 juni 2003 23:41

Acties:

DinX

Motormuis

HTML:

#childDiv{
        padding:0px;
        position:absolute; 
        border:solid;
        width:200px;
        height:300px;
        background-color:white;
        border-width:1px 1px 1px 1px;
        border-color:black;
    }
    
    #childDiv2{
        width:501px;
        left: 200px;
        position:absolute;
        border:solid;
        border-width:1px 1px 1px 1px;
        height:590px;
        border-color:black;
        background-color:white;
    }

Zo ? http://users.skynet.be/DinX/border.html ?

Je had je border op meer plaatsen de breedte van 1px moeten geven, en hem solid maken.

En nog een tip, als je geen webspace hebt die php aankan moet je je files niet als .php opslaan, je krijgt dan gewoon de code te zien.

[ Voor 19% gewijzigd door DinX op 19-06-2003 23:43 ]

Marokko 2015: Route
Sat Tracker: SpotWalla
Blog: Gone for a ride

donderdag 19 juni 2003 23:45

Acties:

Verwijderd

Topicstarter

DinX schreef op 19 juni 2003 @ 23:41:

HTML:

#childDiv{
        padding:0px;
        position:absolute; 
        border:solid;
        width:200px;
        height:300px;
        background-color:white;
        border-width:1px 1px 1px 1px;
        border-color:black;
    }
    
    #childDiv2{
        width:501px;
        left: 200px;
        position:absolute;
        border:solid;
        border-width:1px 1px 1px 1px;
        height:590px;
        border-color:black;
        background-color:white;
    }

Zo ? http://users.skynet.be/DinX/border.html ?

Je had je border op meer plaatsen de breedte van 1px moeten geven, en hem solid maken.

Thanx, maar zo bedoel ik het niet. Ik bedoel dat er hier omheen gewoon 1 grote lijn wordt getrokken. Dus niet die van child en child1 apart.

[ Voor 30% gewijzigd door Verwijderd op 19-06-2003 23:46 ]

donderdag 19 juni 2003 23:49

Acties:

Verwijderd

Topicstarter

http://members.home.nl/mariusjansen/page.JPG
zo wil ik het hebben. en dat die lijn dan van de parent komt...

[ Voor 3% gewijzigd door Verwijderd op 19-06-2003 23:49 ]

donderdag 19 juni 2003 23:54

Acties:

DinX

Motormuis

http://users.skynet.be/DinX/border2.html

height vergeten bij parent style

[ Voor 30% gewijzigd door DinX op 19-06-2003 23:56 ]

Marokko 2015: Route
Sat Tracker: SpotWalla
Blog: Gone for a ride

donderdag 19 juni 2003 23:58

Acties:

Verwijderd

Topicstarter

Hm.. Kom enigszins in de buurt. Hoe heb je die linker lijn voor elkaar gekregen..? Die komt niet van de child af. Die lijn moet nu nog rechts en onder mooi aansluiten en doorlopen.. Maar hoe?

vrijdag 20 juni 2003 00:01

Acties:

DinX

Motormuis

Ik heb hem gewoon gemaakt zoals het er op je pic uit ziet. Kan zijn dat het er bij jou iets anders uit ziet, maar dat zal wel komen doordat er met absolute en relatieve positionering door elkaar gewerkt is.

Dit is eigenlijk gewoon wat prulwerk, dat kan je zelf toch ook wel hè

Verander de hoogtes en breedtes eens enzo.

Marokko 2015: Route
Sat Tracker: SpotWalla
Blog: Gone for a ride

vrijdag 20 juni 2003 00:06

Acties:

Verwijderd

Topicstarter

Bedankt voor je moeite!

Maar, ik mis rechts nog de lijn, maar die zit er onder wel... En de onderste lijn mis ik ook. *Zucht*

Ja, dat prulwerk kan ik wel natuurlijk, maar het klopt in mijn browser (IE6) nog niet helemaal... Die Child2 gaat namelijk over de parent heen met de border ofzo...

vrijdag 20 juni 2003 00:08

Acties:

DinX

Motormuis

Verwijderd schreef op 20 June 2003 @ 00:06:
Bedankt voor je moeite!
Maar, ik mis rechts nog de lijn, maar die zit er onder wel... En de onderste lijn mis ik ook. *Zucht* Ja, dat prulwerk kan ik wel natuurlijk, maar het klopt in mijn browser (IE6) nog niet helemaal... Die Child2 gaat namelijk over de parent heen met de border ofzo...

Ik zie nu dat hij er in IE niet goed uit ziet. Rechts ontbeekt inderdaad een stukje.
In mozilla werkt hij perfect. Ik heb het al eerder gehad dat IE anders met de breedtes omspringt dan mozilla.