Avatar billede noodrem Nybegynder
06. maj 2006 - 11:45 Der er 6 kommentarer og
1 løsning

Problmer med linjeskift

Jeg har i følgende kode:

echo "<div class='bilmodel'>Bilmodel og mærke</div>";
echo "<div class='aargang'>Årgang</div>";
echo "<div class='pris'>Pris</div>";

med tilhørende css:

.bilmodel {
    left:0px;
}
.aargang {
    margin-left:200px;
}
.pris {
    margin-left:400px;
}

Det problem at den laver linjeskift efter hvert div, således at f.eks. Årgang og Pris kommer til at stå på 2 forskellige linjer.
Jeg har ikke indsat noget linjeskift så hvorfor bliver de ikke på samme linje?
Avatar billede goose Nybegynder
06. maj 2006 - 12:20 #1
Prøv og brug <span> istedet.

/Goose
Avatar billede noodrem Nybegynder
06. maj 2006 - 13:44 #2
Når jeg bruger span, ødelægger det resten af designet fuldtstændigt. Det blir dog på samme linje.

Er det forkert at skrive margin-left: 400 px f.eks. ved brug af span?
Avatar billede twotimes Nybegynder
06. maj 2006 - 14:15 #3
du kan evt. prøve at tilføje

position:absolute;

og så  top: ??px;

hvor ?? er den afstand de skal stå i fra toppen. Men måske fucker det også resten i det design op.

Ellers kunne du lave en tabel i den første div...
Avatar billede goose Nybegynder
06. maj 2006 - 15:02 #4
så lås dine spans ved at give dem en fast bredde, f.eks:

.bilmodel {
    left:0px;
    width:200px;
}
.aargang {
    width:400px;

}
.pris {
  width:400px;
}

- kan det ikke gøre det?

/Goose
Avatar billede notes2c Nybegynder
07. maj 2006 - 10:00 #5
CREATE LOGIN umbraco
    WITH PASSWORD = 'P@ssw0rd';
USE umbraco21;
CREATE USER umbraco;
GO


Grunden til at du får linieskift, er p.g.a du anvender et block elementet.
Og de vil altid stå under hindanden, så skal de til at stå ved siden af hindanden
skal der bruges float og de skal have en kendt bredde.

Eks:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>
<head>
<title>Untitled</title>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
.bilmodel {
    margin-left:0px;
    background: lightgreen;
    width: 200px;
    float: left;
}
.aargang {
    margin-left:20px;
    background: lightblue;
    width: 200px;
    float: left;
}
.pris {
    margin-left:40px;
    background: red;
    width: 200px;
    float: left;
}
-->
</style>
<script type="text/javascript">
</script>
</head>

<body>
<div>
<div class="bilmodel">Bilmodel og mærke</div>
<div class="aargang">Årgang</div>
<div class="pris">Pris</div>
<div style="clear: both; font-size: 0; line-height: 0;">&nbsp;</div>
</div>

</body>
</html>

Ved ikke lige hvad du skal bruge det til men det lugter langt væk af noget en TABLE kunne ordne for dig.
Så det var måske vær at overveje.

goose >> Ifølge definitionen kan inline ikke have en bredde, at det så virker i IE når den er i quirkmode.
Det kan man ikke regne med.
Avatar billede notes2c Nybegynder
07. maj 2006 - 10:02 #6
Glem lige den første del det var noget jeg fumlede med og høre ikke til her.
Avatar billede showsource Seniormester
07. maj 2006 - 10:09 #7
Du kan også bruge display: inline; i din css
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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