Søg
Avatar billede minus Nybegynder
05. november 2007 - 21:49 Der er 35 kommentarer og
1 løsning

Hvad gør jeg forkert?

Hej,

Jeg har siddet i noget tid og rodet med noget html og css. Men kan ikke få det til at se rigtigt ud. Har kigget det hele igennem, men kan simpelthen ikke udpege fejlen.

http://retard.dk/aif/

Nogen, som kan forklare, hvor i koden min fejl ligger, og hvad jeg kan gøre for at rette det?

På samme tid så undrer jeg mig også over, hvorfor jeg får disse fejl i koden:
http://validator.w3.org/check?uri=http%3A%2F%2Fretard.dk%2Faif%2F&charset=%28detect+automatically%29&doctype=Inline&group=0

De er der dog ikke, når jeg fjerner indholdet af div id="menu".


Takker på forhånd
Avatar billede soerenlyn Nybegynder
05. november 2007 - 21:53 #1
Det er svært at sige hvordan du skal løse det når du ikke skriver hvad problemet er.

For mig ser det ud som om at midten er lidt for bred, kan du gøre den mindre?
Avatar billede minus Nybegynder
05. november 2007 - 21:59 #2
Well, altså problemet er at det ikke ser rigtig ud :P

Det skal se sådan ud:
http://retard.dk/aif/design.jpg

Men nej, bredden skal være de 760px, så tror ikke den ligger dér.
Avatar billede soerenlyn Nybegynder
05. november 2007 - 22:00 #3
Men prøv at gør den et par pixels mindre... nogle gange passer det ikke helt, selvom det burde gå op.
Avatar billede minus Nybegynder
05. november 2007 - 22:03 #4
Hjælper ikke. Så kommer det til at se sådan ud:

http://retard.dk/aif/design.html
Avatar billede soerenlyn Nybegynder
05. november 2007 - 22:04 #5
Det var så også det forkerte der blev mindre. Nu kom den højre kant længere ind mod midten, men jeg ville have dig til at gøre den hvide baggrund tyndere. Kan dette ikke lade sig gøre?
Avatar billede minus Nybegynder
05. november 2007 - 22:07 #6
Hm, tænker du på billedernes baggrund? Hvis ja, så kan det ikke. Eller jo, men de er en del af billederne, så gør jeg dem mindre, sker der ikke det store.
Avatar billede syvon Nybegynder
05. november 2007 - 22:33 #7
#indhold {
        width: 656px;
        height: 330px;
        float: left;
        background-color: #ffffff;
Avatar billede minus Nybegynder
05. november 2007 - 22:41 #8
syvon, det var et skridt den rigtige vej.

Det ser sådan ud nu:
http://retard.dk/aif/design.html

Men, som man nok kan se, er der stadigvæk et par fejl.
Avatar billede syvon Nybegynder
05. november 2007 - 22:47 #9
er det ved linket malerier du mener
Avatar billede w13 Novice
05. november 2007 - 22:48 #10
Minus>> Fejlene i validatoren skyldes hovedsageligt, at du vælger at kode efter XHTML 1.1 standard. Dette forstår browserne ikke, men det er dog ikke det, der giver fejlen.
I XHTML _skal_ alle tags lukkes. Så dine billedetags skal også. Derfor skal dette f.eks.:
<img src="images/design_01.jpg" alt="">
være:
<img src="images/design_01.jpg" alt=""/>

Og hvis du nu fjerner de store linjeskift omkring billederne, kan det også være, det ser bedre ud i designet. Optimalt set, skal der stå <a ...><img .../></a>
Avatar billede minus Nybegynder
05. november 2007 - 22:58 #11
syvon: det er det bl.a. Altså dér hvor der står "digital grafik" (store billede) skal rykkes op og ligge ved siden af menuen.

Det samme gælder ved indholds-delen. Altså det hvide område. Det skal også rykkes op og ligge ved siden af resten.
Så det, som sagt, kommer til at se sådan ud:
http://retard.dk/aif/design.jpg

og ikke sådan:
http://retard.dk/aif/wrong.jpg
Avatar billede minus Nybegynder
05. november 2007 - 22:59 #12
w13, super. det burde jeg kunne have mig selv. havde et sted en idé om det, ved ikke hvorfor jeg ikke prøvede det :P
Avatar billede syvon Nybegynder
05. november 2007 - 23:01 #13
prøv denne

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>Art I En Fart</title>
    <meta http-equiv="Content-Type" content="application/xhtml+xml; charset=iso-8859-1" />





    <style type="text/css">
    body    {
        background-color: #000000;
        margin-left: 0;
        margin-top: 0;
        margin-width: 0;
        margin-height: 0;
    }
    a    {
        line-height: 0px;
        text-decoration:none;
    }
    img {
        border: none;
    }
    #overall{
        width: 760px;
        height: 651px;
        margin: 0 auto;
    }

    #menu    {
        width: 147px;
        float: left;
        height: 227px;
        line-height:0;
        cursor: pointer;
    }
    menu br{
          margin:0;
          padding:0;

    }
    #top    {
        width: 613px;
        float: right;
        height: 227px;
        background-image: url(http://retard.dk/aif/images/design_02.jpg); 
        clear: both;
    }
    #streg    {
        width: 760px;
        height: 60px;
        background-image: url(http://retard.dk/aif/images/design_07.jpg);
        clear: both;
    }
    #venstre {
        width: 54px;
        height: 330px;
        float: left;
        background-image: url(http://retard.dk/aif/images/design_08.jpg);
    }
    #indhold {
        width: 656px;
        height: 330px;
        float: left;
        background-color: #ffffff;
    }
    #hoejre {
        width: 50px;
        height: 330px;
        background-image: url(http://retard.dk/aif/images/design_10.jpg);
        float: right;
        clear: both;    
    }
    #bund    {
        width: 760px;
        height: 33px;
        background-image: url(http://retard.dk/aif/images/design_11.jpg);
        clear: both;
    }

    </style>




</head>



<body>
<div id="overall">



<div id="menu">



<img src="http://retard.dk/aif/images/design_01.jpg" alt="" onclick="location.href='index.html'"/><br/>       
<img src="http://retard.dk/aif/images/design_03.jpg" alt="" onclick="location.href='index.html'"/><br/>
<img src="http://retard.dk/aif/images/design_04.jpg" alt="" onclick="location.href='index.html'"/><br/>
<img src="http://retard.dk/aif/images/design_05.jpg" alt="" onclick="location.href='index.html'"/><br/>
<img src="http://retard.dk/aif/images/design_06.jpg" alt="" onclick="location.href='index.html'"/>

</div>

<div id="top">
</div>


<div id="streg">
</div>

<div id="venstre">
</div>

<div id="indhold">
</div>

<div id="hoejre">
</div>


<div id="bund">
</div>





</div>
</body>
</html>
Avatar billede minus Nybegynder
05. november 2007 - 23:03 #14
syvon, stadig det samme..
http://retard.dk/aif/index2.html
Avatar billede w13 Novice
05. november 2007 - 23:05 #15
Minus>> Bemærk også, at W3C validatoren foreslår, du kalder din fil .xhtml, så den får den rigtige mimeType. Når nu du absolut vil programmere uunderstøttet XHTML. :P
Avatar billede w13 Novice
05. november 2007 - 23:06 #16
Minus>> Nu er der da ikke mellemrum mellem menupunkterne. Det var der på min computer før. Nu ser det helt rigtigt ud hos mig, i IE7.
Avatar billede syvon Nybegynder
05. november 2007 - 23:06 #17
her hos mig ser det fint ud
Avatar billede w13 Novice
05. november 2007 - 23:07 #18
Tror måske, du skal gøre din #overall lidt bredere.
Avatar billede w13 Novice
05. november 2007 - 23:08 #19
Jeg kan se, du bruger FF, minus. Det er åbenbart der, den går galt. Men prøv at sætte en større bredde på overall.
Avatar billede minus Nybegynder
05. november 2007 - 23:11 #20
Ah ja. Kan se at det ser korrekt ud i internet explorer.
Men vil meget gerne have at den også ser sådan ud i andre browsere, da jeg bl.a. selv bruger firefox.

Kan det gøres? Og hvordan?

w13, har forsøgt mig med at kalde filen index2.xhtml, men så vil den have at man downloader filen i IE.
Avatar billede w13 Novice
05. november 2007 - 23:15 #21
Ja, ok, som sagt understøtter browserne endnu ikke XHTML. Men find #overall i din CSS-del og ret dens width til et noget større pixeltal.
Avatar billede minus Nybegynder
05. november 2007 - 23:15 #22
Har forsøgt med en bredere "overall". Får stadig samme fejl i firefox.
Avatar billede w13 Novice
05. november 2007 - 23:20 #23
Prøvet at sætte:
width:800px;
i #overall?
Avatar billede w13 Novice
05. november 2007 - 23:22 #24
I øvrigt kan du rette:
        margin-left: 0;
        margin-top: 0;
        margin-width: 0;
        margin-height: 0;
Til:
        margin: 0;
Avatar billede minus Nybegynder
05. november 2007 - 23:25 #25
w13, det ser sådan ud:
http://retard.dk/aif/index3.html

Kan også se at det også ser forkert ud i IE
Avatar billede w13 Novice
05. november 2007 - 23:30 #26
Well, prøv at fjerne:
        clear: both;
Fra #top.
Avatar billede minus Nybegynder
05. november 2007 - 23:34 #27
w13, det ser bedre ud nu. Nu er det kun det efter "indhold", som er på næste linje. Har forsøgt at fjerne cleat: both; fra #højre, men det hjælper ikke rigtigt, kan jeg se.
Avatar billede syvon Nybegynder
05. november 2007 - 23:40 #28
prøv denne http://povlsen.cc/exp/minus.html
Avatar billede w13 Novice
05. november 2007 - 23:41 #29
Fjern det også fra #hoejre.

Firefox viser det faktisk ligesom du har kodet det. =) clear:both; betyder, at der ikke må være elementer på hverken højre eller venstre side. Så koden gør faktisk det rigtige i Firefox lige nu. =)
Avatar billede minus Nybegynder
05. november 2007 - 23:52 #30
syvon, det er jo bare perfekt :P
smider du svar?

laver også lige en tråd med points til w13 for al det informative, du har kommet med idag :)
Avatar billede minus Nybegynder
05. november 2007 - 23:52 #31
w13 --> http://www.eksperten.dk/spm/804519
Avatar billede syvon Nybegynder
05. november 2007 - 23:53 #32
kan godt lave et svar men vil ikke have alle 200 så giv du bare w13 point her også
Avatar billede minus Nybegynder
06. november 2007 - 00:06 #33
syvon, w13 har hjulpet mig med et par andre tråde idag, så kan godt smide lidt ekstra til ham. Og synes nu også du kan tillade dig at tage de 200 eftersom du kodede meget. :)
Avatar billede w13 Novice
06. november 2007 - 00:07 #34
Du ta'r dem bare, Syvon! :)
Avatar billede syvon Nybegynder
06. november 2007 - 17:55 #35
jamen så takker.:)
Avatar billede syvon Nybegynder
06. november 2007 - 18:02 #36
men mener stadigt at w13 skulle have mindst halvdelen for sit besvær
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
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.

Opret Log ind

Du kan også logge ind via nedenstående tjenester

Alle kategorier på Eksperten
Seneste spørgsmål Seneste aktivitet
I går 13:36 godt råd søges Alternativ styresystem på Mac pc Af luffe1955 i Andre styresystemer
I går 11:32 Hjælp til kontrol af sygefravær Af Maja i Excel
27/0113:59 2 skærme til en stationær computer Af BIRGER i Skærme
26/0119:26 Opstart af ny computer Af Bent i Windows
25/0120:06 Hjemmeside der virker både på mobil og computer Af Strawberry i PHP
White papers
Flere white papers »