Gå til innhold

Div,Div,Div-alle ved siden av hverandre, mulig?


Anbefalte innlegg

Er det mulig å ha flere div ved siden av hverandre slik at jeg slipper å lage tabeller som noen er svært kritiske mot? (deriblant jeg etter å ha funnet ut av at en av mine html docs ble over 476 kb med ca. 40 tabeller og unicode)

 

Og en ting til: Hvis jeg bruker css og z-index for å få en gif-animation som bakgrunn, vil det gå an? og er det mulig å duplicate imagen og når den blir duplicated, blir alle img-ene loadet hver for seg slik at det tar 40 timer?

post-76-1098423564_thumb.jpg

Endret av realfingolfin
Lenke til kommentar
Videoannonse
Annonse
Er det mulig å ha flere div ved siden av hverandre slik at jeg slipper å lage tabeller som noen er svært kritiske mot?

 

<div id="wrap">
<div id="left"> Innhold </div>
<div id="center"> Innhold </div>
<div id="right"> Innhold </div>
</div>

body {

text-align: center;

}

 

#wrap {

width: 600px;

margin: 0 auto;

text-align: left;

}

 

#left {

float: left;

width: 150px;

}

 

#center {

float: left;

width: 300px;

}

 

#right {

width: 150px;

float: left;

}

Lenke til kommentar
hvis man skal ha en div under alle de dvene igjen da? hva skriver man da?

sliter med å få en div på neste linje hvis du skjønner hva jeg mener.

Ta sånn paint-ting sånn som meg så skjønner vi det bedre, jeg skjønte det ikke hvertfall

 

Edit: Det går fint det, bare kopier f.eks .left og rename KOPIEN til f.eks left_under

 

og html <div class="left_under">Lorem Ipsum</div>

 

Men sørg for å ha det etter alle de andre divene, de som skal være over den du vil ha.

 

css

body
{
text-align: center;
background-color: #465354;
}
.header
{
width: auto;
text-align: center;
margin: 1px;
border-style: solid;
border-width: 1px;
border-color: #fff;
background-color: #808076;
margin-bottom: 3px;
}
.container
{
background-color: #423517;
height: 400px;
width: auto;
margin: 12px;
}
.footer
{
background-color: #818691;
text-align: center;
font-size: 12pt;
font-family: system;
margin-top: 13px;
margin-left,right: 1px;
border-style: solid;
border-color: #fff;
border-width: 1px;

}
.wrap
{
width: auto;
margin: 0 auto;
text-align: left;
}
.left {
float: left;
width: 23%;
margin-left: 1px;
background-color: #808976;
height: 1000px;
border-style: solid;
border-color: #fff;
border-width: 1px;
}
.left_down {
float: left;
width: 23%;
margin-left: 1px;
background-color: #808976;
height: 1000px;
border-style: solid;
border-color: #fff;
border-width: 1px;
}

hr
{
color: fff;
}

a:link
{
background-color:#000;
}
.center {
width: 55%;
float: left;
height: 1000px;
margin-left: 10px;
background-color: #808069;
border-style: solid;
border-color: #fff;
border-width: 1px;
}
a:link 
{
color: #654348;
background-color: #inherit;
text-decoration: none;
}   
a:visited 
{
color: #354354;
text-decoration: none;
}
a:hover 
{
color: orange;
text-decoration: underline;
font-family: system;
}
a:active 
{
color: #575964;
text-decoration: none;
}
.right {
width: 19.58%;
float: left;
height: 1000px;
margin-left: 10px;
margin-right: 1px;
background-color: #808072;
border-style: solid;
border-width: 1px;
border-color: #fff;
}
div
{
font-family: system;
font-size: 12pt;
}

html

<html>

<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>Innhold</title>
<link rel="stylesheet" type="text/css" href="stil.css">
</head>

<body>
<div class="header""><a href="http://www.google.com" alt="dette er en test på hover">www.google.com</a>
<p>Dette var en test på hover, driver og mekker header på ps..</div>
<div class="wrap">
 <div class="left">
   Navigasjon
   Jepp, her skal jeg ha navigasjon ,har kommet frem til en ide, men vil gjerne vite hvordan du gjør..oh, der fant jeg det på google :-)
 </div>
 <div class="center">
   Innhold
   Ser ut til at du stakk innom fra forum.hardware.no
   Vel, se deg omkring og slakt løs.
   <br>
   <br>
   <ul><li>Som du sikkert ser så er fargene sugent men av en kobinasjon på xxxxxx^xxxxxx så har jeg vanskeligheter med å finne passende og matchende farger, det er spesielt dette jeg vil ha slakting på. Don't worry be happy, skal endre li med et eller annet bilde</ul>
 </div>
 <div class="right">
   Her tror jeg at jeg skal ha en shoutbox eller lignende, søkefunksjon knaskje, linker, reklame (ikke større enn 100x100) Kom gjerne med forslag til hva jeg kan gjøre med dette..
 </div>
 <div class="footer">Vel tenkte at epost, admin osv. kunne plasseres hit., driver med footer i ps.</div>
<div class="left_down">BlaBlaBlaBlaBla</div>
</body>

</html>

Endret av realfingolfin
Lenke til kommentar
hvis man skal ha en div under alle de dvene igjen da? hva skriver man da?

sliter med å få en div på neste linje hvis du skjønner hva jeg mener.

Setter egenskapen clear: both på den aktuelle div'en (footer f.eks)

Eller clear: left; i dette tilfellet.. Eller ikkje noke i det heile tatt, rett og slett fordi det ikkje er plass til den ved sida av dei andre :p

 

</kverulere>

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å
  • Hvem er aktive   0 medlemmer

    • Ingen innloggede medlemmer aktive
×
×
  • Opprett ny...