Avatar billede TiHs Nybegynder
19. oktober 2007 - 21:16 Der er 13 kommentarer og
1 løsning

Div css i IE6

hej eksperter

Jeg har lavet følgende htm og css som virker fint i IE 7 og FireFox men bare ikke i ie 6 ??:

CSS:

/* CSS Document */


        /* DIVS */

/* div villa main */

        .villamain{
        margin: 0 auto; /* nulstiller align center i div */
        text-align: left; /* nulstiller align center i div */
        overflow: hidden; /* stopper for udvidelse af div */
        width: 700px; /* bredden på din boks */;
        position: relative;
    }
        .a1{
        background: #000000;
        height: 1px;
        margin-left: 350px;
        margin-right: 0px;
        }
        .a2{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 349px;
        margin-right: 0px;
        height: 1px;
        }
        .a3{
        background-color: green;       
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 348px;
        margin-right: 0px;
        height: 1px;
        }
        .a4{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 347px;
        margin-right: 0px;
        height: 1px;
        }
        .a5{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 346px;
        margin-right: 0px;
        height: 1px;
        }
        .a6{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 345px;
        margin-right: 0px;
        height: 1px;
        }
        .a61{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 344px;
        margin-right: 0px;
        height: 1px;
        }
        .a62{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 343px;
        margin-right: 0px;
        height: 1px;
        }
        .a63{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 342px;
        margin-right: 0px;
        height: 1px;
        }
        .a64{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 341px;
        margin-right: 0px;
        height: 1px;
        }
        .a65{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 340px;
        margin-right: 0px;
        height: 1px;
        }
        .a66{
        background-color: green;
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 339px;
        margin-right: 0px;
        height: 1px;
        }
        .a67{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 338px;
        margin-right: 0px;
        height: 1px;
        }
        .a68{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 337px;
        margin-right: 0px;
        height: 1px;
        }
        .a69{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 336px;
        margin-right: 0px;
        height: 1px;
        }
        .a610{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 335px;
        margin-right: 0px;
        height: 1px;
        }
        .a611{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 334px;
        margin-right: 0px;
        height: 1px;
        }
        .a612{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 333px;
        margin-right: 0px;
        height: 1px;
        }
        .a613{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 332px;
        margin-right: 0px;
        height: 1px;
        }
        .a614{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 331px;
        margin-right: 0px;
        height: 1px;
        }
        .a615{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 330px;
        margin-right: 0px;
        height: 1px;
        }
        .a616{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 329px;
        margin-right: 0px;
        height: 1px;
        }
        .a617{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 328px;
        margin-right: 0px;
        height: 1px;
        }
        .a618{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 327px;
        margin-right: 0px;
        height: 1px;
        }
        .a619{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 326px;
        margin-right: 0px;
        height: 1px;
        }
        .a620{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 325px;
        margin-right: 0px;
        height: 1px;
        }
        .a621{
        border-left: 325px solid #000000;
        border-right: 1px solid #000000;
        margin-left: 0 px;
        margin-right: 0px;
        height: 1px;
        }
        .a7{
        border-left: 1px solid #000000;
        border-right: 1px solid #000000;
        margin: 0px 0px;
        height: 1px;
        padding: 2px;
        height: 500px;
        }
        .a8{
        background: #000000;
        height: 1px;
        }



/* slut div villa main */


/* div menu */

        #menu{
        border: solid 0px #000000;
        position: relative;
        width: 335px;
        left: 350px;
        top: -23px;
        }


        /* SLUT DIVS */

        /* TEKST */

.style1 { /*alm. tekst på siderne */
font-family: Arial;
font-size: 12px;
color: #000000;
}
.style2 { /* menu teksten */
font-family: Arial;
font-size: 12px;
color: #000000;
font-weight: bold;
}


HTML:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>

    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>Villaholdet</title>

        <link rel="stylesheet" type="text/css" href="villastyle2.css" />
        <!--[if IE]>
        <link rel="stylesheet" type="text/css" href="villastyle.css" />
        <![endif]-->

    </head>

<body>
<br>
<div id="villamain">
<div id="a1"></div>
<div id="a2"></div>
<div id="a3"></div>
<div id="a4"></div>
<div id="a5"></div>
<div id="a6"></div>
<div id="a61"></div>
<div id="a62"></div>
<div id="a63"></div>
<div id="a64"></div>
<div id="a65"></div>
<div id="a66"></div>
<div id="a67"></div>
<div id="a68"></div>
<div id="a69"></div>
<div id="a610"></div>
<div id="a611"></div>
<div id="a612"></div>
<div id="a613"></div>
<div id="a614"></div>
<div id="a615"></div>
<div id="a616"></div>
<div id="a617"></div>
<div id="a618"></div>
<div id="a619"></div>
<div id="a620"></div>
<div id="a621"></div>
<div id="a7">
<div id="menu"><span class="style2">HOME | HOLDET | KAMPE | REGNSKAB | KONTAKT | GALLERI</span></div>
</div>
<div id="a8"></div>
</div>


</body>
</html>
Avatar billede olebole Juniormester
19. oktober 2007 - 22:04 #1
<ole>

Jeg ser nogenlunde det samme i FF som i IE6 (har ikke 7.0 på denne maskine) - og jeg har ingen anelse om, hvordan det skal se ud.

Det er ikke som sådan invalid CSS, du skriver, men det har absolut intet med idéen bag CSS at gøre. Med dén kode kan du såmænd ligeså godt bruge tabeller  :)

/mvh
</bole>
Avatar billede TiHs Nybegynder
19. oktober 2007 - 22:26 #2
Hej olebole ... øver mig så godt jeg kan i at lave divs i css med diverse kanter og
runde hjørner og helst uden gif ...
Indtil videre kan jeg finde ud af det med en px ad gangen ...
Men ser du en blå firekant med en top der er kantet og en sort border ?
Avatar billede TiHs Nybegynder
19. oktober 2007 - 22:31 #3
tror jeg gav dig den lidt forkerte kode .. se her:
www.villaholdet.dk/nyvilla
Avatar billede olebole Juniormester
20. oktober 2007 - 00:35 #4
- der er sikkert også nogen, der kan finde på at bruge et stykke tyggegummi til at åbne en øl med. Uden tvivl meget sjovt at lege med - men næppe brugbart til andet  :)
Avatar billede TiHs Nybegynder
20. oktober 2007 - 11:16 #5
hvis jeg så skal lave kanter og cirkler på divs ... hvor finder jeg så en god tutorial til at lære det ? Hvad kan du anbefale ??
Avatar billede olebole Juniormester
20. oktober 2007 - 12:19 #6
1) Det skal du da vel heller ikke
2) Aner det ikke
3) Jeg kan kun anbefale, du undlader

Som sagt er det sikkert meget sjovt at lege med, men det er ikke noget, du ser seriøse programmører lege med i dagslys  :)
Avatar billede Keld Nielsen Professor
20. oktober 2007 - 12:24 #7
Avatar billede olebole Juniormester
20. oktober 2007 - 12:38 #8
- men brug det til leg. Det er rygende ineffektivt - og på de fleste punkter _langt_ værre end store tabel-helveder til layout-brug
Avatar billede TiHs Nybegynder
20. oktober 2007 - 14:12 #9
Vil du mene at det er smartere med bare at bruge baggrunde i tabellen eller alm. divs ?
Avatar billede olebole Juniormester
20. oktober 2007 - 14:14 #10
Ja, streger, cirkler, trekanter o.lign. bør ikke laves med små, farvede elementer. Brug grafik i stedet ... f.eks. baggrundsbilleder  :)
Avatar billede TiHs Nybegynder
06. oktober 2008 - 16:57 #11
Send et svar så jeg kan lukke. :o)
Avatar billede olebole Juniormester
06. oktober 2008 - 19:28 #12
;o)
Avatar billede olebole Juniormester
07. oktober 2008 - 22:46 #13
Tak for points  =)
Avatar billede TiHs Nybegynder
07. oktober 2008 - 22:56 #14
var så lidt :O)
Avatar billede Ny bruger Nybegynder

Din løsning...

Tilladte BB-code-tags: [b]fed[/b] [i]kursiv[/i] [u]understreget[/u] Web- og emailadresser omdannes automatisk til links. Der sættes "nofollow" på alle links.

Loading billede Opret Preview
Kategori
Vi tilbyder markedets bedste kurser inden for webudvikling

Log ind eller opret profil

Hov!

For at kunne deltage på Computerworld Eksperten skal du være logget ind.

Det er heldigvis nemt at oprette en bruger: Det tager to minutter og du kan vælge at bruge enten e-mail, Facebook eller Google som login.

Du kan også logge ind via nedenstående tjenester