Gå til innhold

DIV's som finner størrelse selv

Finnduz

Av Finnduz
i Programmering og webutvikling

Anbefalte innlegg

Finnduz

Finnduz

Skrevet
Skrevet

Hei,

 

Har et lite problem. Problemet mit er at jeg har en banner på 800px men på hver side skal jeg ha en div box som skal inneholde en spesefikk bakgrunn. Men, jeg trenger en måte å få div boxene til å "automatisk" sjekke bredden selv, se her f.eks

 

oklw6.jpg

 

Hvordan kan jeg gjøre dette med css? jeg prøvde med "width: auto;" men kom ikke så langt med noe av det jeg prøvde.. noen forslag?

Lenke til kommentar

Videoannonse

Videoannonse
Annonse
Skagen

Skagen

Skrevet
Skrevet (endret)

Om jeg ikke misforstår deg, så er det enklest slik plusminus foreslår at du lager f.eks en body-tag som fyller ut hele siden, og inni den legger du en banner-DIV-tag.

 

CSS:

 

.body {
width: 100%;
background-image: url('bakgrunnsbilde.jpg')
}

#banner {
margin-left: auto;
margin-right: auto;
width: 800px;
}

 

HTML:

 

<html>
<head>
</head>
<body class="body">
	<div id="banner">
	</div>
</body>
</html>

Endret av Skagen
Lenke til kommentar
Finnduz

Finnduz

Skrevet
  • Forfatter
Skrevet

Nei, dette går ikke. fordi, bakgrunnen skal matche opp med selve banneren. Den er ikke lik på venstre og høyre side. Hvis dette hadde vært likt kunne jeg bare lagd en bakgrunn av banneren men det kan jeg altså ikke. Derfor trenger jeg en div på hver side av banneren.

Lenke til kommentar
ThomasQ

ThomasQ

Skrevet
Skrevet
Nei, dette går ikke. fordi, bakgrunnen skal matche opp med selve banneren. Den er ikke lik på venstre og høyre side. Hvis dette hadde vært likt kunne jeg bare lagd en bakgrunn av banneren men det kan jeg altså ikke. Derfor trenger jeg en div på hver side av banneren.

 

Javel, da bruker du float.

Lenke til kommentar
Rinox

Rinox

Skrevet
Skrevet

Eneste måten jeg tenker du kan gjøre dette på er ved å sette en spesifikk bredde på layouten din. Ellers kan du bruke Javascript eller noe for å finne ut hva skjerm-oppløsningen er og jobbe deg videre derfra.

 

.body {
width: 1200px;
background-image: url('bakgrunnsbilde.jpg')
}

#banner {
margin-left: auto;
margin-right: auto;
width: 800px;
}

#venstre {
float: left;
width: 200px;
}

#hoyre {
float: right;
width: 200px;
}

Lenke til kommentar

Opprett en konto eller logg inn for å kommentere

Du må være et medlem for å kunne skrive en kommentar

Opprett konto

Det er enkelt å melde seg inn for å starte en ny konto!

Start en konto

Logg inn

Har du allerede en konto? Logg inn her.

Logg inn nå
Gå til emneliste
×
×
  • Opprett ny...