Avatar billede EIHP Juniormester
24. januar 2006 - 17:16 Der er 42 kommentarer og
1 løsning

div 50 px left fra center hvordan?

jeg har et div som er placeret i center med <center><div id="projects_menu" style="position: absolute; width:598px; height:125px; z-index:1; top: 205px;">

Men den er lige 50px for meget til højre.. hvordan for jeg den til gå 50px til siden fra midten?
Avatar billede roenving Novice
25. januar 2006 - 06:54 #1
Så skal du droppe dit center-tag (som også er deprecated !-)

-- det kræver desuden at du sætter en fuldt kvalificeret doctype inklusive dtd-link, f.eks.

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

-- som det allerførste i dokumentet foran <html>-tagget ...

-- så skal du tilpasse margin-left i denne:

<div id="projects_menu" style="position: absolute; width:598px; height:125px; z-index:1; top: 205px; left:50%; margin-left: -249px;">
Avatar billede EIHP Juniormester
25. januar 2006 - 07:40 #2
Hmm.. når jeg indsætter den dumme linje der, så bliver alt min tekst fed...
Avatar billede roenving Novice
25. januar 2006 - 07:53 #3
-- der er jo ikke noget i den linje, der udløser fed skrift, så det må du have et andet sted !-)
Avatar billede EIHP Juniormester
25. januar 2006 - 09:35 #4
Nope.. i dreamweaver ser den ud som den skal.. men i IE og firefox, bliver teksten fed
Avatar billede olebole Juniormester
25. januar 2006 - 09:55 #5
<ole>

Du må aldrig bruge DW til at preview'e sider i. Det er en browser, de skal ses i - hvorfor det naturligvis er de forskellige browsere, du skal checke i. Hvordan DW vælger at vise dine sider, er underordnet  :)

Den linje, roenving viser (den såkaldte HTML4.01 DTD), er en forudætning for, at IE kan tolke CSS bare nogenlunde ordentligt ... så den kan du ikke undgå.
Bliver din tekst fed med DTD'en, må du helt sikkert lave en fejl et eller andet sted

/mvh
</bole>
Avatar billede EIHP Juniormester
25. januar 2006 - 10:13 #6
Hvorfor er det mig der har lavet en fejl? det kan da lige så godt være den linje? fordi, der bliver kun brugt tekst det ene sted.. resten er table.
Avatar billede EIHP Juniormester
25. januar 2006 - 10:16 #7
desuren, så start jeg indsætter den linje. forsvinder alt der hedder 100% i højden.. nogle af baggrundsbillederne i table. kommer nogle pixel forkert ind...
Avatar billede olebole Juniormester
25. januar 2006 - 10:31 #8
"Hvorfor er jorden rund? Den kan da ligeså godt være flad!" - nej, sådan hænger det ikke helt sammen  ;o)

DTD'en er det mest fundamentale i et HTML-dokument. Uden den, er der ikke tale om et HTML-dokument ... uanset, hvad der ellers måtte stå i det.
Hvis du skal have en chance for at få din side til at se ens ud i forskellige browsere, er den _absolut_ nødvendig, da IE ikke understøtter box-modellen uden. Box-modellen er den del af CSS, der dikterer, hvordan elementers margin, border og padding skal tolkes og renderes.

CSS foreskriver desuden, at hvis et elements højde sættes i procent, skal højden beregnes udfra det omkransende elements højde - hvorfor denne eksplicit skal være sat. Det gælder også body- og html-elementerne.

Hvis du bruger en korrekt DTD, vil en 100% høj tabel blive 0px høj i IE, hvis ikke body- og html-elementerne har fået sat højden ... f.eks. til 100%.
Det er den standardiserede opførsel - og sådan opfører alle andre fornuftige browsere sig.
Bruger du derimod ikke en DTD, opfører IE sig helt specielt.

Dit problem er formodentlig, at IE pludselig opfører sig, som den skal ifølge CSS, når du skriver DTD'en.
Løsningen er, du lærer at kode korrekt i forhold til gældende standarder  :)
Avatar billede olebole Juniormester
25. januar 2006 - 10:37 #9
Prøv f.eks. dette dokument i IE og FF (der begge viser det korrekt):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>TITLE</title>
<style type="text/css">
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
div {
    width: 200px;
    height: 200px;
    background: yellow;
}
.withBorder {
    border: 80px solid red;
}
</style>
</head>
<body>

<div>&nbsp;</div>
<div class="withBorder">&nbsp;</div>

</body>
</html>

- gør så det samme med (uden DTD-URL viser IE det forkert):

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>TITLE</title>
<style type="text/css">
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
div {
    width: 200px;
    height: 200px;
    background: yellow;
}
.withBorder {
    border: 80px solid red;
}
</style>
</head>
<body>

<div>&nbsp;</div>
<div class="withBorder">&nbsp;</div>

</body>
</html>

- prøv så dette (helt uden DTD, viser IE det også forkert):

<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>TITLE</title>
<style type="text/css">
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
div {
    width: 200px;
    height: 200px;
    background: yellow;
}
.withBorder {
    border: 80px solid red;
}
</style>
</head>
<body>

<div>&nbsp;</div>
<div class="withBorder">&nbsp;</div>

</body>
</html>

- blot en HTML-kommentar før DTD'en er nok til at smadre IE's CSS-tolkning:

<!-- En kommentar -->
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>TITLE</title>
<style type="text/css">
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
div {
    width: 200px;
    height: 200px;
    background: yellow;
}
.withBorder {
    border: 80px solid red;
}
</style>
</head>
<body>

<div>&nbsp;</div>
<div class="withBorder">&nbsp;</div>

</body>
</html>
Avatar billede olebole Juniormester
25. januar 2006 - 10:41 #10
- og som du kan se, kan man sagtens få en tabel til at blive 100% høj, hvis bare man koder korrekt:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <title>TITLE</title>
<style type="text/css">
html, body {
    height: 100%;
    margin: 0;
    padding: 0;
}
table {
    height: 100%;
    width: 400px;
    margin: 0 auto;
    background: red;
}
</style>
</head>
<body>

<table>
<tbody>
<tr>
    <td>Blabla</td>
</tr>
</tbody>
</table>

</body>
</html>

- læg også mærke til, teksten ikke bliver fed  ;o)
Avatar billede EIHP Juniormester
25. januar 2006 - 13:52 #11
Hmm.. så sæt den lige sammen med kildekoderne på www.googus.dk og skriv hele siden som den skal se ud? fordi hos mig, bliver siden smadret..
Avatar billede olebole Juniormester
25. januar 2006 - 13:59 #12
"så sæt den lige sammen med kildekoderne på www.googus.dk og skriv hele siden som den skal se ud?"

Der er vist noget, du har misforstået. Du retter - og lægger en side op ... så kikker jeg på den.
Avatar billede EIHP Juniormester
25. januar 2006 - 14:57 #13
Det ser så lækkert ud nu, tak! Meget i lig, picasso.. Havde jeg aldrig tænkt på til en hjemmeside.. tak
Avatar billede EIHP Juniormester
25. januar 2006 - 15:04 #14
Da jeg tildelte <table width="100%" height="100%" border="0" cellspacing="0" cellpadding="0"> id="hovedramme"

Og ændret
table {
    height: 100%;
    width: 400px;
    margin: 0 auto;
    background: red;
}
til
table.hovedramme {
    height: 100%;
    width: 400px;
    margin: 0 auto;
    background: red;
}
Ser siden ud som den skal.. bortset fra, teksten bliver fed.. så find lige fejlen, vis du mener jeg gør noget forkert?
Avatar billede EIHP Juniormester
25. januar 2006 - 15:05 #15
Desværre, er der fejl i IE nu.. men firefox viser siden perfekt..
Avatar billede roenving Novice
25. januar 2006 - 15:48 #16
-- i de ovenstående styles er der ikke noget, der gør teksten fed, så det må findes et andet sted ...

-- og det er helt sikkert, at hverken IE eller nogen anden css-fortolker finder på at lave teksten om til fed, hvis de ikke får en besked på det !-)
Avatar billede EIHP Juniormester
25. januar 2006 - 15:50 #17
Jamen, så find fejlen? for jeg har ik bedt den om det.. og hvad jeg ved til html, kan jeg ik se jeg ber den om det.. så mon ik din hellige gral (<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">) ik er så god igen..
Avatar billede olebole Juniormester
25. januar 2006 - 16:10 #18
F.eks. roder du rundt mellem <td> og <th> - totalt uden gennemskuelige planer. Som bekendt skrives tekst i th-elementer med fed skrift  ;o)
Avatar billede EIHP Juniormester
25. januar 2006 - 16:12 #19
Efter at ha total omskrevet hele siden i dreamweaver med <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

som hovedplan, forsvadt 100% i højde, plus, at teksten var fed lige fra starten..
Avatar billede olebole Juniormester
25. januar 2006 - 16:13 #20
- og der er ikke tale om en hellig gral ... tværtimod! Du taler derimod med to professionelle kodere, der ved, hvad de taler om  =)
Avatar billede olebole Juniormester
25. januar 2006 - 16:14 #21
- de 100% har vist fortalt dig om, ikk'?  :)
Avatar billede EIHP Juniormester
25. januar 2006 - 16:25 #22
det bare sjovt, at så snart jeg bruger den kode, fucker det hele op.. jeg har hellere aldrig hørt om de koder før, vi 2 fortalte om den, og jeg har skrevet html siden 1997..
Avatar billede olebole Juniormester
25. januar 2006 - 22:43 #23
Ja, men du har tydeligvis ikke fulgt med - og det er en tvingende nødvendighed, når man beskæftiger sig med en spritny teknologi. Det, vi taler om her, burde være helt grundlæggende viden for enhver, der skriver til WWW  ;o)

http://www.w3.org/TR/html401/#minitoc
- punkt 21, 22 og 23

http://www.w3.org/TR/html401/#minitoc
- læs under: The !DOCTYPE "Switch"
Avatar billede olebole Juniormester
25. januar 2006 - 22:44 #24
- og med al respekt, så er årsagen til, din kode fucker up, at du skriver fejlfyldt kode  :)
Avatar billede olebole Juniormester
25. januar 2006 - 22:45 #25
Sorry ... det andet link skulle være dette:
    http://msdn.microsoft.com/library/default.asp?url=/library/en-us/dnie60/html/cssenhancements.asp

- læs under: The !DOCTYPE "Switch"
Avatar billede EIHP Juniormester
26. januar 2006 - 15:43 #26
jeg skriver ik noget.. dreamweaver skriver opsætningen for mig..
Avatar billede EIHP Juniormester
26. januar 2006 - 16:04 #27
nu har jeg gjort det om og om 7-8 gange.. og hvergang ender det med noget lort.. så med mindre du har en full løsning.. så kan jeg ik se det er godt.. selv flere af mine venner, kan ik finde pointen i det..
Avatar billede olebole Juniormester
26. januar 2006 - 23:14 #28
Hvis du og dine venner ikke kan se pointen med det, roenving og jeg har skrevet, må det være fordi, I har yderst begrænset viden om HTML/CSS - hvilket din kode også tyder klart på.

Hvad er begrundelsen for at bruge th-elementer i stedet for td-elementer, de steder, hvor du gør det? Valget virker helt tilfældigt, når jeg ser i koden - og sådan bør det naturligvis ikke være.

Derudover indeholder koden grove fejl. Denne nestning er f.eks. helt hen i vejret og går et par steder:

</th></tr>
</table></th>
        <th scope="col" width="598" height="186">

Fejlen findes f.eks. også i denne variant:

</th>
  </tr>
</table></td>
        </tr>
Avatar billede olebole Juniormester
26. januar 2006 - 23:15 #29
"Denne nestning er f.eks. helt hen i vejret og går igen et par steder" ... skulle der stå  :)
Avatar billede EIHP Juniormester
27. januar 2006 - 06:57 #30
Prøv nu at fat, at det er dreamweaver der har skrevet tablen.. jeg har ik rigtigt rørt noget af det..
Avatar billede EIHP Juniormester
27. januar 2006 - 06:57 #31
Men måske jeg bare skulle gå tilbage til frontpage.. det virket i det mindste ordenligt..
Avatar billede olebole Juniormester
27. januar 2006 - 08:43 #32
Her er det vist ikke mig, der har svært ved at fatte  ;o)

At gå over til FP ville være yderst fjollet, da den som bekendt er herostratisk berømt for at skrive ekstremt dårlig kode.
Til gengæld ville det nok være en rigtig god idé at sætte sig ind i, hvordan DW virker - selvom det ikke kan passe, når du forsøger tørre fejlene af i den.

DreamWeaver sætter ikke th-elementer i tabel, med mindre den bliver bedt om det og den viste nestning kunne DW _aldrig_ finde på at lave, uanset hvordan du måtte vride og tæske den - så noget må du jo have gjort  :)
Avatar billede EIHP Juniormester
27. januar 2006 - 16:53 #33
Ligge meget hvordan jeg sætter DW op.. så bruger den TH og ik TD.. FP bruger jo TD.. og jeg er også vant til det hedder td colspan og ik th scope="col"
Avatar billede roenving Novice
27. januar 2006 - 17:06 #34
Så skriv det selv !-)
Avatar billede roenving Novice
27. januar 2006 - 17:14 #35
-- og i øvrigt er netop et th-lement default med federe skrift, så det er altså præcis grunden til, at du får det, se f.eks. w3cs udgave af et default stylesheet til html4: http://www.w3.org/TR/CSS21/sample.html !o]
Avatar billede EIHP Juniormester
27. januar 2006 - 17:18 #36
Det vidste jeg så ikke.. jeg har ik rigtig interresseret mig for html i meget lang tid.. jeg har mere lavet php og asp.. samt lidt c++
Avatar billede olebole Juniormester
30. januar 2006 - 07:33 #37
Skriver man ASP og/eller PHP, gælder det om at holde sin frontend-viden godt opdateret ... det er trods alt frontend kode, serverkoden skal spytte ud.
- og med hensyn til th-elementer er der vist ikke sket meget nyt siden 1992  =)

I standard-opsætningen, indsætter DW ikke th-elementer uden at få besked på det - og 'th scope="col"' mener jeg heller ikke at have set i DW. Prøv helt at fjerne DW fra maskinen og reinstaller den ... du må have lavet et eller andet uhensigtsmæssigt i dens opsætning
Avatar billede EIHP Juniormester
31. januar 2006 - 22:21 #38
Jeg for det samme, og skolens computer, laver også det nummer, og der var det installeret i forvejen..
Avatar billede olebole Juniormester
04. februar 2006 - 01:02 #39
Så har du helt specielle evner, når du bliver kombineret med en DW! Vil du også påstå, det er DW, der på egen hånd har lavet den helt vanvittige nestning, jeg viser i (26/01-2006 23:14:50)? Det _kan_ ganske enkelt ikke passe!  :)
Avatar billede EIHP Juniormester
30. juni 2006 - 00:08 #40
olebole.. nu har jeg haft dw tre gange på to forskellige maskiner.. og den sætter selv tablen op den vej.. så jeg skal ikke kunne afgøre om jeg har specielle evner.. men jeg har fundet mig en validation tools.. så jeg kan hurtigt løse det.. men den melder fejl ved baggrunde og den slags.. hvordan skal jeg løse det?
Avatar billede EIHP Juniormester
28. april 2008 - 21:50 #41
Olebole ligger du et svar?
Avatar billede EIHP Juniormester
22. juli 2009 - 10:16 #42
Olebole sød at smide et svar?
Avatar billede olebole Juniormester
22. juli 2009 - 10:21 #43
Sorry, jeg har haft travlt i en periode og derfor været her så meget  =)
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