Notifikationer

Markér alle som læst Log ud

bongii Nybegynder

16. juli 2008 - 20:07 Der er 5 kommentarer og
1 løsning

baggrunde der overlappes

Hej.

Tjek først dette billede: www.movievizion.dk/upload/test.gif

Jeg er ved at lave to søjler, hvor grafikelementerne skal være baggrunde der overlapper hinanden, hvis i forstår. Kan det lade sig gøre.

Har lavet noget i stil med:
CSS:
<style type="text/css">
.bg1{background-image:url(images/bg1.gif); background-repeat:repeat-x; background-position:top}
.bg3{background-image:url(images/bg3.gif); background-repeat:repeat-x; background-position:top}
</style>

BODY:
<div class="bg1" style="width:150px"> </div>
<div class="bg3" style="width:450px"> </div>

Men det dækker kun søjle 1 & 2. Ved ikke hvordan jeg får integreret søjle 3 & 4.

Er der en der kan hjælpe?

Synes godt om

w13 Novice

17. juli 2008 - 09:56 #1

Hvis det bare er som på billedet, kan du vel gøre sådan her:

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

<style type="text/css">
.bg1{
float:left;
background-color:red;
}
.bg2{
float:left;
background-color:red;
}
.bg3{
background-color:blue;
}
.bg4{
background-color:blue;
}
</style>

<body>

<div class="bg1" style="width:150px"></div><div class="bg3" style="width:75px"></div>
<div class="bg2" style="width:450px"></div><div class="bg4" style="width:100px"></div>

Synes godt om

bongii Nybegynder

17. juli 2008 - 10:00 #2

Har faktisk lige lavet det på denne måde - det virker lidt bedre.

<style type="text/css">
#bg1 {position: absolute;background-image: url(bg1.gif); background-repeat:repeat-x;}
#bg2 {position: absolute;background-image: url(bg2.gif); background-repeat:repeat-x;}
#bg3 {position: absolute;background-image: url(bg3.gif); background-repeat:repeat-x;}
#bg4 {position: absolute;background-image: url(bg4.gif); background-repeat:repeat-x;}
</style>

<div id="bg1" style="width:800px"> </div>
<div id="bg2" style="width:700px"> </div>
<br>
<div id="bg3" style="width:700px"> </div>
<div id="bg4" style="width:400px"> </div>

Synes godt om

w13 Novice

17. juli 2008 - 10:03 #3

Tak for point! :)

Virker det bedre? For mig at se, ser det helt ens ud, bortset fra at min kode er lidt kortere. :P

Synes godt om

bongii Nybegynder

17. juli 2008 - 15:53 #4

Nej det virkede faktisk på samme måde.

Har lige et tillægsspm.

Hvordan laver jeg en række divs:
<div style="width:100%">
<div class="left">produkt</div>
<div class="right">Pris
</div>

<div style="width:100%">
<div class="left">produkt</div>
<div class="right">Pris
</div>

osv.

Jeg kan ikke få produktet og prisen til at stå 100% på linje.

Synes godt om

roenving Novice

17. juli 2008 - 17:14 #5

Prøv at sætte den right-floatede ting først ...

Synes godt om

bongii Nybegynder

18. juli 2008 - 10:45 #6

klasse, tak.

Synes godt om

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.

Følg dette spørgsmål

Opret Preview

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.

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten

Seneste artiklerRSS