Søg
Avatar billede centauri Nybegynder
04. april 2010 - 23:10 Der er 13 kommentarer og
1 løsning

Baggrunds billeder passer ikke ved større tabel

Hej

Jeg har et lille problem med en siden jeg er ved at lave.
http://www.centauri.dk/bg/

Jeg har en tabel der fylder hele siden ud plus jeg har 2 baggrunds billeder et der ligger sig i toppen og et i bunden der så fader sammen på midten.
Når jeg har en side der ikke skal scrolles i passer det hele perfekt sammen.
Men idet jeg har noget indhold på siden der får min tabel til at vokse over de 100% i højden så bliver den sidste del af siden man scroller med på bare med en fast baggrunds farve.
Der skulle mit sidste billede altid gerne ligge sig i bunden selvom tabellen bliver større.

Er der nogen der ved hvad jeg gør galt, ellers hvordan jeg ellers kan lave den ønskede funktion.
Avatar billede Slettet bruger
05. april 2010 - 00:20 #1
Du kan benytte et par DIV'er, som ligger "under" indholdet - og ikke scroller.

"under" = lavere z-index end teksten, og position:fixed (fixed = fast i forhold til skærmen (i modsætning til siden som normalt))

Men, ærligt talt, det lyder som om du bruger en masse krudt på en feature som ingen alligevel vil lægge mærke til - (men risikerer at det knækker)
Du kan jo ikke ikke vide hvor stor/lille brugerens browser-vindue er...

Så, var det ikke bedre om du bare brugte ét baggrundsbillede, som gentager sig når man scroller ?
Avatar billede centauri Nybegynder
05. april 2010 - 10:18 #2
Nej det er korrekt jeg ikke kender brugerens browser størrelse.
Er også derfor den automatisk skal tilpasse sig størrelsen. Og er også det jeg har fået lavet her som egentlig også virker lige indtil indholdet overskrider hvad der kan vises uden at scrolle.

For hvis du prøver at gøre dit browser vindue mindre så følger billederne automatisk med og tilretter sig.

Nu er jeg ikke helt så hård til det med DIV'er endnu.
Har du evt et eksempel på den løsning du henviser til.

For hele layoutet er lidt afhændig af den effekt med at fade billederne sammen på midten.
Avatar billede Slettet bruger
05. april 2010 - 11:14 #3
S'gerne: http://villytildethele.dk/tmp/SamleBag.html

For klarhedens skyld, er de to halvdele af baggrundsbilledet meget destinkte - så man med det samme ville se det, hvis ikke de passede perfekt sammen. (hvad de gør her, både i Chrome & Firefox & Opera på Linux - jeg har ikke set hvordan det ser ud med problembarnet iE..?)

PS:
Men nu hvor jeg HAR lavet det, indser jeg hvor unødvendigt det var.
Der kunne præcis lige så godt, blot have været eet stort billede.
- men det var jo ikke det du bad om : )
Avatar billede centauri Nybegynder
05. april 2010 - 11:10 #4
Fandt en anden måde at lave det på i tabeller så lukker spørgsmålet her og takker for dine indput.
Avatar billede centauri Nybegynder
05. april 2010 - 11:23 #5
Selve farven på baggrunds billedet er jeg heller ikke helt færdig med endnu der kan der nåes at lave meget om endnu.

Jeg har testet det båe i IE8, Chrome og Firefox og her passer alt stadig sammen efter det nye layout.

For fandt lige en hel anden måde at lave det nu nu igen som nok er bedre og mere over i dne løsning du foreslog.

http://www.centauri.dk/bg/test.htm

Men nej et stort billede ville jo ikke kunne give den effekt jeg ønsker med at den er mørkere i toppen og bunden så vil det jo prøve et billede der er afhænig af at længden på indholdet
Avatar billede Slettet bruger
05. april 2010 - 11:34 #6
Men det er jo netop det smarte ved position:fixed
- det placeres i forhold til skærmen, uanset dokumentets størrelse.

I dit eksemel (set herfra) sker der et pludseligt farveskift hvor "bund" begynder.

PS: Og sammenlign lige hvor lidt "kode" (få muligheder for fejl) der er i min i forhold til din løsning.
Avatar billede Slettet bruger
05. april 2010 - 11:39 #7
Nå, farveskiftet forsvandt mens jeg skrev : )

Og nu ser jeg hvad du mener - den mørkere bund SKAL ligge i bunden af dokumentet - uanset dets størrelse.

I så fald kan du lade de to halvdele være placeret vha. position:absolute - inden i content-blokken - men ellers efter samme princip som i mit eksempel.
Avatar billede centauri Nybegynder
05. april 2010 - 11:45 #8
Nu ved jeg ikke om jeg gør noget forkert med dit eksempler, men hvis jeg retter det til giver det følgende resualtat
http://www.centauri.dk/bg/SamleBag.htm

Så der ligger det sidste billede sig ikke i bunden af siden.

For ellers som du selv siger var dit jo at foretrække da det er med mindre kode.
Avatar billede centauri Nybegynder
05. april 2010 - 11:47 #9
Hov i Chrome og Firefox ser det rigtigt ud. Men IE8 viser det ikke korrekt.
Og skal jo helst kunne ses korrekt i alle browsere.
Avatar billede Slettet bruger
05. april 2010 - 11:52 #10
Prøv denne: http://villytildethele.dk/tmp/SamleBag2.html

Og gør vinduet bredere/smallere for at se hvordan det tilpasser sig.
Avatar billede centauri Nybegynder
05. april 2010 - 12:04 #11
Ja nu ser det bedre ud. Lige udover at den ikke fylder 100% i breden selvom det egentlig er angivet
http://www.centauri.dk/bg/SamleBag2.htm
Avatar billede Slettet bruger
05. april 2010 - 12:10 #12
Der er bare fordi der er lidt "luft" i selve grafikfilen.
Avatar billede Slettet bruger
05. april 2010 - 12:12 #13
Sorry, det var min side jeg refererede til.

I din er "problemet" at content ikke fylder 100% i bredden (fordi du bider tekstlinjerne over med <br>.

Giv #content width:100%
Avatar billede centauri Nybegynder
05. april 2010 - 12:18 #14
Ah selvfølgelig den havde jeg lige overset.

Så siger jeg ihverfald 1000 tak for hjælpen.
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
Webudvikling kurser
Vi tilbyder markedets bedste kurser inden for webudvikling
Se alle Webudvikling kurser

Flere spørgsmål fra HTML kategorien

Titel Indlæg Oprettet Seneste aktivitet
Hjælp med HTML og CSS Af Nojsa i HTML 18 10/09/202515:07 17/09/202515:11
CSS 2 x firkanter + tekst på samme linje Af nemlig i HTML 3 19/03/202522:16 20/03/202513:04
Se og ændre html på en webside Af magger i HTML 4 11/03/202513:55 12/03/202506:56
Få input felt, der er med fed skrift og formatteres på linje Af KurtG i HTML 5 02/03/202520:05 04/03/202515:40
Variabler som ikke virker Af Frits Jensen i HTML 3 30/10/202409:37 01/01/202515:27
Se alle spørgsmål i kategorien Opret spørgsmål

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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
27/1222:02 Låse brugt iPad op Af drstein i iOS, iPhone & iPad
27/1219:21 Hvor finder jeg en oversigt over mine spørgsmål Af KurtG i Hjælp og fejl
27/1211:31 TP-Link Wifi extender opsat som accesspoint giver 50% up- og download, Af Uvanga i Wifi
26/1213:05 Hvorfor bliver tiff-filer større ved konvertering til samme format Af KurtG i Billedbehandling
23/1221:36 Gøre Ikonerne lidt større i proceslinjen (Windows 10) Af Ikke-ekspert i Windows
White papers
Flere white papers »