Avatar billede Qhran Nybegynder
07. marts 2012 - 10:56 Der er 15 kommentarer og
1 løsning

HTML CSS problem

Hej. Jeg er i gang med en hjemmeside som jeg gerne vil ligge ud på nettet om nogle måneder. Men jeg kan ikke få designet til at fungere. Meningen er at der på min side skal være en border på den <td> der hedder copyright. Men den viser ingenting.

Kan i hjælpe mig. Her er HTML koden:

<html>
  <head>
    <title>Your Wishlist</title>
    <link rel="stylesheet" type="text/css" href="tema.css"/>
  </head>
 
  <body>
    <table class="index" width="800px">
     
      <!-- Header -->
      <tr>
        <td class="header">
          <h1 class="header">Your Wishlist</h1>
          <p class="header">Welcome to your wishlist, the place where you store your wishes, as you wish.</p>
        </td>
      </tr>
     
      <!-- Login -->
      <tr>
        <td class="login">
         
          <table class="login">
            <tr>
              <td class="login-head">
                <h1 class="login-head">Login</h1>
              </td>
            </tr>
           
            <tr>
              <td class="input-user" width="200px">
                <input type="text" name="username" value="Username"></input>
              </td>
             
              <td rowspan="2" class="submit" width="50px">
                <input type="submit" value="Login"></input>
              </td>
            </tr>
           
            <tr>
              <td class="input-pass">
                <input type="password" name="password" value="********"></input>
              </td>
            </tr>
           
          </table>
         
        </td>
      </tr>
     
      <!-- Register -->
      <tr>
        <td class="register">
         
          <table class="register">
            <tr>
              <td class="register-head" colspan="2">
                <h1 class="register-head">Register</h1>
              </td>
            </tr>
           
            <tr>
              <td class="register-body" colspan="2">
                <p class="register-body">Username</p>
                <input type="text" name="username" value="Username">
              </td>
            </tr>
           
            <tr>
              <td class="register-body" colspan="2">
                <p class="register-body">Password</p>
                <input type="password" name="password" value="Password">
              </td>
            </tr>
           
            <tr>
              <td class="register-body" colspan="2">
                <p class="register-body">Repeat password</p>
                <input type="password" name="passwordrepeat" value="Password">
              </td>
            </tr>
           
            <tr>
              <td class="register-body" colspan="2">
                <p class="register-body">Email</p>
                <input type="text" name="email" value="example@ex.com">
              </td>
            </tr>
           
            <tr>
              <td class="register-body" colspan="2">
                <p class="register-body">Repeat Email</p>
                <input type="text" name="emailrepeat" value="example@ex.com">
              </td>
            </tr>
           
            <tr>
              <td class="termsofuse">
                <input class="termsofuse" type="checkbox" name="termsofuse">
              </td>
              <td class="termsofuse">
                <p class="termsofuse">"I accept the <a href="termsofuse.php">terms of use</a>."</p>
              </td>
            </tr>
           
            <tr>
              <td class="register-button" colspan="2">
                <input type="submit" value="Register">
              </td>
            </tr>
          </table>
         
        </td>
      </tr>
     
      <!-- Copyright -->
     
      <tr>
        <td class="copyright">
        </td>
      </tr>
    </table>
  </body>
</html>

og her er css koden:

/*-- Copyright --*/

  td.copyright {
    border-top: 1px dotted black;
  }

/*-- Header --*/

  h1.header {
    font-family: "Calibri", calibri;
    font-size: 3em;
    margin-left: 5px;
    margin-bottom: 10px;
    padding: 0;
  }

  p.header {
    font-family: "Calibri", calibri;
    font-size: 1.2em;
    margin-top: 10px;
    margin-bottom: 10px;
    padding: 0;
  } 
 
  table.header {
    border: 0;
  }

/*-- Index --*/
 
  table.index {
    max-width: 800px;
    margin-left: auto;
    margin-right: auto;
    border-collapse: collapse;
    margin-bottom: 100px;
  }

 
/*-- Login --*/

  h1.login-head {
    font-family: "Calibri", calibri;
    margin: 0;
    font-size: 2em;   
  }

  td.login {
    border-left: 1px solid black;
    border-top: 1px solid black;
    border-right: 1px solid black;
    border-bottom: 1px dotted black;
    padding-bottom: 50px;
    padding-top: 50px;
  }
 
  table.login {
    max-width: 250;
    margin-left: auto;
    margin-right: auto;
    padding: 20px;
  }

/*-- Register --*/

  input.termsofuse {
    margin-top: 22px;
  }

  h1.register-head {
    font-family: "Calibri", calibri;
    margin: 0;
    font-size: 2em;
  }
 
  p.register-body {
    font-family: "Calibri", calibri;
    font-size: 20px;
    margin-bottom: 0;
    margin-top: 10px;
  }
 
  p.termsofuse {
    margin-top: 20px;
  }
 
  table.register {
    max-width: 250;
    margin-left: auto;
    margin-right: auto;
    padding: 20px;
  }

  td.register {
    border-left: 1px solid black;
    border-right: 1px solid black;
    padding-bottom: 50px;
    padding-top: 50px;
  }
 
  td.register-button {
    text-align: center;
  }
Avatar billede mediman Nybegynder
07. marts 2012 - 11:02 #1
Erstat

td.copyright {
    border-top: 1px dotted black;
  }

med

.copyright {
    border-top: 1px dotted black;
  }
Avatar billede olsensweb.dk Ekspert
07. marts 2012 - 11:05 #2
inden du roder merer med det, så lav dit design om!!
tabeller er til tabulære data ikke til design.
tabel design er man gået bort fra for ca 10 år siden
Avatar billede aaberg Nybegynder
07. marts 2012 - 11:10 #3
Det virker hos mig. Jeg har copy / pastet din kode ind i en fil, og borderen kommer uden problemer!

men ronols har ret. Det er ikke smart at bruge tabeller til den slags design. Brug hellere lidt tid på at sætte dig ind i hvordan du gør det rigtigt.
Avatar billede Qhran Nybegynder
07. marts 2012 - 11:10 #4
Jeg har lige prøvet at bruge .copyright i stedet for td.copyright og det virkede ikke.

ronols. Jeg kan ikke arbejde med div, ikke fordi jeg ikke har erfaringerne med det men mere fordi at sidst jeg arbejdede med det tilføjede jeg én linie og så gik det hele fra hinanden.
Avatar billede Qhran Nybegynder
07. marts 2012 - 11:11 #5
aalberg_cc
Hvilken browser brugte du? Jeg bruger firefox
Avatar billede keysersoze Guru
07. marts 2012 - 11:12 #6
Hvis du ikke har en DOCTYPE kan du ikke forvente at noget som helst virker efter hensigten. http://www.web-dev.dk/post/DOCTYPE-og-valid-kode-ens-udseende-i-Internet-Explorer-og-FireFox.aspx
Avatar billede Qhran Nybegynder
07. marts 2012 - 11:15 #7
Jeg bruger et program der fortæller hvis der er noget kode der ikke er en del af HTML, CSS, PHP, MySQL eller Javascript sprogene.
Avatar billede aaberg Nybegynder
07. marts 2012 - 11:20 #8
Jeg har prøvet med IE, firefox og chrome. Den border virker fint alle steder.

Alt indhold i dine tabeller er dog venstrejusteret i Chrome (en konsekvens af at du bruger tabeller til layout ;)
Avatar billede Qhran Nybegynder
07. marts 2012 - 11:20 #9
Glem det, jeg har fundet problemet. Det ser ud til at når min kode går igennem phpmyadmin i firefox, så er der et eller andet der bliver glemt i koden.
Avatar billede Qhran Nybegynder
07. marts 2012 - 11:22 #10
Og en anden ting jeg fandt ud af er pga zoom. Linien forsvinder efter en bestemt zoom længde
Avatar billede keysersoze Guru
07. marts 2012 - 11:22 #11
En DOCTYPE er som sådan heller ikke en del af HTML-standarderne - men ikke desto mindre er den overordentlig vigtig da browseren ellers viser siden i quirks-mode og det er bestemt ikke hensigtsmæssigt.
Avatar billede DeeDawg Nybegynder
07. marts 2012 - 12:01 #12
"Jeg kan ikke arbejde med div, ikke fordi jeg ikke har erfaringerne med det men mere fordi at sidst jeg arbejdede med det tilføjede jeg én linie og så gik det hele fra hinanden."

- jamen, så har du jo netop ikke erfaringer med det. Uanset hvad, er det ikke en undskyldning, der retfærdiggøre brugen af tables til layout. :)
Avatar billede Qhran Nybegynder
08. marts 2012 - 08:40 #13
Jeg har erfaringer med det, og jeg kan godt arbejde med div, jeg HADER bare at gøre det fordi til sidst f***er det op et eller andet sted.
Avatar billede Qhran Nybegynder
08. marts 2012 - 08:40 #14
THREAD LUKKET.
Avatar billede Qhran Nybegynder
08. marts 2012 - 08:51 #15
Thread Closed
Avatar billede keysersoze Guru
08. marts 2012 - 09:26 #16
Sjovt som inkompetente webudviklere altid forsøger at skyde skylden på teknologien og browserne fremfor egne evner.
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
Kurser inden for grundlæggende programmering

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