/ Forside / Teknologi / Udvikling / HTML / Nyhedsindlæg
Login
Glemt dit kodeord?
Brugernavn

Kodeord


Reklame
Top 10 brugere
HTML
#NavnPoint
molokyle 11184
Klaudi 5506
bentjuul 3377
severino 2040
smorch 1950
strarup 1525
natmaden 1396
scootergr.. 1320
e.c 1150
10  miritdk 1110
Border på div - virker kun i IE
Fra : Thomas Møller Nexø


Dato : 12-04-06 20:59

Hejsa,

Jeg er ved at designe en hjemmeside, hvor jeg helst vil undgå
tabeller til designet.
Derfor forsøger jeg at bruge divs og det fungerer da også
nogenlunde. Dog har jeg et mindre problem i firefox og netscape i
forhold til explorer.

Siden kan ses på http://afterworld.dk

Problemet er at kanterne (borders) på den div, der hedder
"containerContent" ikke bliver vist.
Det er vidst fordi at den slet ikke strækkes med ud sammen med de
nestede divs. Dette sker altså kun i IE.

Hvordan kan jeg lave det sådan, at der kommer en ydre kant på
siderne?

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

 
 
David Trasbo (13-04-2006)
Kommentar
Fra : David Trasbo


Dato : 13-04-06 15:28

Thomas Møller Nexø skrev:

> Problemet er at kanterne (borders) på den div, der hedder
> "containerContent" ikke bliver vist.
> Det er vidst fordi at den slet ikke strækkes med ud sammen med de
> nestede divs. Dette sker altså kun i IE.

Du skriver i CSS:

border-left : inset 1px #eeeeee;
border-right : outset 1px #eeeeee;

Hvad med bare at skrive "solid" i stedet for "inset" og "outset"?

"Inset" og "outset" bruges når man vil skabe en rammeeffekt eller en
skyggeeffekt. Det vil sige, at hvis du skrev:

border: inset 1px #eeeeee;

.... ville øverste og venstre kant være i mørke farver, og de andre i lidt
lysere farver.

Se evt. http://www.webtip.dk/typark/alleegenskaber/typark_borderstyle.php.
(Tilfældigt fundet på Google).

--
David Trasbo.
Vær en god Usenet-bruger. http://usenet.dk/netikette.



Thomas Møller Nexø (13-04-2006)
Kommentar
Fra : Thomas Møller Nexø


Dato : 13-04-06 22:01

> Hvad med bare at skrive "solid" i stedet for "inset" og "outset"?
>

Hejsa David.
Jo det har du da bestemt ret i.
Det vil jeg så gøre.

Men har du et forslag til det mit indlæg virkelig handlede om?
Border-typen er jo ikke problemet, snarere, at den ikke vises fordi den
yderste div ikke strækkes med den nestede hvor indholdet er i.

Med venlig hilsen,
Thomas

--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Dennis Munding (14-04-2006)
Kommentar
Fra : Dennis Munding


Dato : 14-04-06 10:49

Hej Thomas!
"Thomas Møller Nexø" <tmn@havensupport.dk> skrev i en meddelelse
news:443d5c17$0$15790$14726298@news.sunsite.dk...
> Hejsa,
>
> Jeg er ved at designe en hjemmeside, hvor jeg helst vil undgå
> tabeller til designet.
> Derfor forsøger jeg at bruge divs og det fungerer da også
> nogenlunde. Dog har jeg et mindre problem i firefox og netscape i
> forhold til explorer.
>
> Siden kan ses på http://afterworld.dk
>
> Problemet er at kanterne (borders) på den div, der hedder
> "containerContent" ikke bliver vist.
> Det er vidst fordi at den slet ikke strækkes med ud sammen med de
> nestede divs. Dette sker altså kun i IE.
>
> Hvordan kan jeg lave det sådan, at der kommer en ydre kant på
> siderne?

Jeg har leget lidt med dit stylesheet, og med følgende, kan jeg se en border
i FF, men der mangler stadig lidt fin-pudsning...

Problemet er, at du bruger position:absolute/relative på så at sige alle
dine elementer...

html,body {
margin: 10px 0px 10px 0px;
padding: 0px 0px 0px 0px;
text-align: center;
font-family : Arial,Tahoma,Verdana;
font-size : 12px;
font-style : normal;
font-weight : normal;
text-decoration : none;
color : #000000;
background-color : #ffffff;
}

a {
color: Blue;
text-decoration: none;
}

a:hover {
color: blue;
text-decoration: underline;
}

H1 {
font-size : 14px;
color : #000000;
font-weight : bold;
letter-spacing: 3px;
margin-top: 4px;
margin-bottom : 4px;
}

H2 {
font-size : 14px;
color : #000000;
font-weight : bold;
margin-top : 4px;
margin-bottom : 4px;
}

H3 {
font-size : 14px;
color : #000000;
font-weight : bold;
margin-bottom : 0px;
margin-top: 10px;
letter-spacing: 3px;
}

/* Rammem om hele sitet */
#containerSite {

margin: 0px auto;
width: 96%;
padding: 0px;
text-align: center;
background-color : #ffffff;
}

/* ----------------------------------------------*/
/* Toppen - relateret indhold til toppen starter */
/* ----------------------------------------------*/
#containerTop {
position: relative;
height: 125px;
padding: 0px;
margin: 0px auto;
text-align : left;
background-image : url("/grafik/bag_top.gif");
}

#topLeft {
position: absolute;
width: 25%;
height: 125px;
padding: 0px;
text-align : left;
}

#topRightTop {
float : right;
width: 75%;
height: 95px;
padding: 5px 10px 0px 0px;
text-align : right;
}

#topRightBottom {
position: absolute;
top : 100px;
left : 30%;
width: 70%;
padding: 2px 2px 2px 2px;
text-align : center;
}

/* ----------------------------------------------*/
/* Midten - relateret indhold til midten starter */
/* ----------------------------------------------*/

NB! Det er absolut ikke en færdig skabelon, men du kan selv arbejde videre
med det...
Håber, at du kan bruge det til noget....


Med venlig hilsen
--
Dennis Munding
Web-master
http://www.skovaa-munding.dk/, http://www.mundings-memorial.dk/
http://www.cantica.dk/, http://www.pe-vagtservice.dk/,
http://www.eds-denmark.dk/



Thomas Møller Nexø (18-04-2006)
Kommentar
Fra : Thomas Møller Nexø


Dato : 18-04-06 18:45

> NB! Det er absolut ikke en færdig skabelon, men du kan selv arbejde videre
> med det...
> Håber, at du kan bruge det til noget....
>
>
> Med venlig hilsen
> --
> Dennis Munding

Hej Dennis.
Og tak for dit svar.

Jeg har selv fundet et svar på problemet - ved at sætte en div ind under selve
indholdet skaber man igen ramme-effekten.

Dog er jeg en smule i tvivl om hvad du mener når du skriver at jeg bruger
relative og absolute positionering hele tiden. Har jeg noget valg?
Jeg vil jo gerne have siden til at have en fast bredde osv. så jeg troede at
dette var måden at gøre det på...

Er der en anden måde hvor man undgår dette og dermed ikke skaber det problem som
udgangspunktet for mit indlæg omhandlede?

Med venlig hilsen,
Thomas


--
Vil du lære at kode HTML, XHTML, CSS, SSI, ASP eller ASP.NET?
- Pædagogiske tutorials på dansk
- Kom godt i gang med koderne
KLIK HER! => http://www.html.dk/tutorials

Thomas Jari (18-04-2006)
Kommentar
Fra : Thomas Jari


Dato : 18-04-06 20:51

On 18 Apr 2006 17:45:29 GMT, Thomas Møller Nexø <sdfsd@dsafds.dk>
wrote:


>Er der en anden måde hvor man undgår dette og dermed ikke skaber det problem som
>udgangspunktet for mit indlæg omhandlede?

Prøv med en float:left på den div med borderen.


--
Thomas Jari
http://thomas.weblogging.dk

Søg
Reklame
Statistik
Spørgsmål : 177552
Tips : 31968
Nyheder : 719565
Indlæg : 6408847
Brugere : 218887

Månedens bedste
Årets bedste
Sidste års bedste