---

Hej

Jeg har et problem med repeat-y og IE.
Jeg har lavet et eksempel på problemet her: http://www.aidata.dk/shop/index2.php

Når venstre eller højre column bliver højere end den i midten vil IE ikke "repeat" det miderste billede. Jeg har bare udvidet venstre column med en masse <p> så problemet kan ses.

Jeg har været i grundig google søgning, men uden held.
Mit stylesheet er som følger:

.bg_header {
   background-color: #C69C6C;
   background-image: url(images/myimages/bg_header.jpg);
   background-repeat: no-repeat;
}
.bg_cnt_top {
   background-color: #C69C6C;
   background-image: url(images/myimages/bg_content_top.jpg);
   background-repeat: no-repeat;
}
.bg_cnt_repeat {
   background-color: #C69C6C;
   background-image: url(images/myimages/bg_content_repeater.jpg);
   background-repeat: repeat-y;
}
.bg_cnt_bottom {
   background-color: #C69C6C;
   background-image: url(images/myimages/bg_content_bottom.jpg);
   background-repeat: no-repeat;
}
.bg_left_repeat {
   background-color: #C69C6C;
   background-image: url(images/myimages/bg_left_repeat.jpg);
   background-repeat: repeat-y;
}
.bg_right_repeat {
   background-color: #C69C6C;
   background-image: url(images/myimages/bg_right_repeat.jpg);
   background-repeat: repeat-y;
}
.bg_5px {
   background-color: #C69C6C;
   background-image: url(images/myimages/bg_5px_repeater.gif);
   background-repeat: repeat-y;
}
.bg_foot {
   background-color: #C69C6C;
   background-image: url(images/myimages/bg_footer.jpg);
   background-repeat: no-repeat;
}

---

Jeg bruger IE7 og har svært ved at se dit problem

Du bruger et hvidt baggrundsbillede til klassen .bg_cnt_repeat , men da dit eksempel ligeledes har en hvid baggrund (..ingen farve defineret) er det lidt svært at se om det rent faktisk du'er.

Prøv lige at 'repeate' med nogle andre baggrunde, så man kan se hvad der forgår

En anden ting er at du benytter tabeller og grafik til at tegne 'kasser'. Hvorfor?

CSS'es boxmodel er da langt mere fleksibel. Her et eksempel på de 3 spalter du prøver at implementere: http://webdesign101.dk/csslayout/favorit2005-3.php (Læs: "En interessant løsning uden grafik")

Runde hjørner på 'kasserne' kan også klares uden grafik:

1.) Javascript: http://www.webdesign101.dk/showcase/roundcorners/nifty.html
2.) Ren CSS: http://www.webdesign101.dk/css/roundcorners/

Lidt om baggrunde: http://webdesign101.dk/www/background/

Der er meget godt at finde på http://www.webdesign101.dk/ og Jørgen er en flink man, som også ind imellem giver sig tid at besvare relevante spørgmål som dit, hvis du skriver til ham.

</MOLOKYLE>

---

Her går man i dybden med de 3 spalter: http://www.alistapart.com/articles/holygrail

..og her lidt om gradienter med *.png filer som baggrundsbilleder: http://www.alistapart.com/articles/supereasyblendys

</MOLOKYLE>

---

Nu har jeg lavet en baggrund i grå så burde det være nemmer og se. :D

http://www.aidata.dk/shop/index2.php
Sådan set der ud hvis jeg udvider den miderste column med <p>
Ved godt at det miderste billed er mindre end top og bund men har eksperimenteret en del idag.

http://www.aidata.dk/shop/index3.php
Og sådan ser det ud hvis man udvider den venstre volumn med <p> eller alt muligt andet selvfølgelig.

Håber at du kan se det nu ?

Det med at jeg bruget tables istedet for ccs. Skyldes to ting, den første er at jeg bruger et opensource system som giver output i tables med en width sat til 100% og det andet er nok at jeg ikke før idag da var klar over styrken i CCS. Desværre tror jeg ikke at jeg kan slippe uden tables lige nu men der skal helt sikkert ikke bruges tables til det næste projekt.. :D

Jeg havnede også på http://webdesign101.dk/csslayout/favorit2005-3.php tidligere idag men det hjalp ikke når man bruger tables.

Jeg vil lige se på alle den links du har lavet så vender jeg tilbage.

---

Prøv at sætte sort border på dine tabelceller <table border="1">. Jeg gætter på at det er i dit <table> layout at 'hunden' ligger begravet og ikke i din CSS kode. Dette ses bedre om du midlertidigt lægger 'kanter' på tabel og celler.

Dette kan iøvrigt også gøres med CSS:

table {border: 1px solid #000;}

evt. også tr {border: 1px solid #000;} og td {border: 1px solid #000;}

Så vil du se at det er tabelfelternes relative størrelse og ikke deres baggrundsbilledes repeat egenskab som laver knuder ...hvis ikke jeg tager fejl

Dit øverste felt bliver så stort at .bg_cnt_repeat først starter et stykke længere nede end du havde tænkt dig.

</MOLOKYLE>

---

Rigtige gode artikler kan især godt lide dem med de runde hjørner og gradienter da jeg ofte bruger photoshop til det.

Vil helt sikkert kunne lave den miderste box uden brug af billeder nu.
Plus jeg får hurtigerere responstider :D

Jeg er blevet 7 link rigere i mine bogmærker tusind tak for det og din tid molekyle du har været til stor hjælp.

---

Så kom der border på.

---

Jeg kan godt se hvad du mener med at det er bunden på TD som følger med ned isteder for at blive større. Det burdr bare ikke bliver større jeg har sat det til at være 20px høj.
Men så kan jeg jo ikke lade være med at spørge hvordan fixer man det ?

---

Tak for svaret molokyle jeg kan komme vidre nu.

Eftersom du ikke er logget ind i systemet, kan du ikke skrive et indlæg til dette spørgsmål.

Hvis du ikke allerede er registreret, kan du gratis blive medlem, ved at trykke på "Bliv medlem" ude i menuen.