Positioner och align

Collapse
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • yOINKfoX
    Medlem
    • 2012-04-09
    • 11
    #1

    Positioner och align

    Hej nu skriver jag åter igen här i hopp om svar på ett problem jag brottats med tills jag blivit smått galen!
    Jag laddade upp 2 bilder den ena på hur det ser ut just nu och den andra på hur jag vill att det ska se ut.
    här är även koden:
    HTML
    [kod]<body>
    <table width="auto" height="auto;" style="margin:auto";>
    <tr>
    <td>
    <a href="start/index.html">
    <img src="img/1.jpg" width="700" height="525"/></td>
    </a>
    </tr>
    </table>
    <p class="copyright">
    Copyright
    </p>
    </span>
    <table>
    <tr>
    <td>
    <span style ="position:absolute;left:0; bottom:0"><H3>
    <br/>
    Fashion / Beauty / About / Blog
    </td></span></H3>
    </tr>
    </table>
    </body>
    [/kod]
    CSS
    [kod]body {
    background-color: #fffdfc;
    border-color: #FFF;}
    img {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 700px;
    height: 525px;
    margin-top: -390px; /* Half the height */
    margin-left: -359px; /* Half the width */
    border: 3px solid #FFF;}
    .kategori{
    floateft;
    bottom:0px;
    position:absolute;}
    .copyright{
    float: right; }
    [/kod]
    Hjälp uppskattas
    Attached Files
    Last edited by voigtann1; 2012-05-02, 07:38. Reason: lagt in kodblock så man kan läsa text och kod.
    Tags: None
    • voigtann1
      Forumvärd
      • 2001-06-14
      • 8810
      #2
      din HTML kod är felaktig,
      du stänger td innan du stänger ditt a-element på bilden.
      du öppnar span och stänger den innan du har stängt alla andra element (sen bör inte ett inline-element omsluta ett block element om du vill validera din HTML).

      Ta bort tabeller, finns ingen anledning för dig att köra tabeller med den layout (ge dig bara fler element som du måste jobba mot)

      städa upp din kod och postar gärna vilken doctype du kör
      "det går inte att lära en gammal norrlänning byta namn på irc" - gammalt kinesiskt uttryck

        Comment

        • yOINKfoX
          Medlem
          • 2012-04-09
          • 11
          #3
          <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
          <html xmlns="http://www.w3.org/1999/xhtml">
          <head>
          <title>Robin K Ferm</title>
          <link href="css/index.css" rel="stylesheet" type="text/css"/>
          </head>
          <body>
          <a href="start/index.html">
          <img src="img/1.jpg" width="700" height="525"/></td>
          </a>
          <p class="copyright">
          Copyright
          </p>
          </span>
          <span style ="position:absolute;left:0; bottom:0"><H3>
          <br/>
          Fashion / Beauty / About / Blog
          </span></H3>
          </body>
          </html>

          Så du hade rätt jag är bara så van att arbeta med tabeller, men jag får fortfarande inte ihop hur jag ska få copyrighten till att lägga sig så som jag vill i den klara bilden jag bifogade innan och när jag lägger in och försöker jag lägga in en logga över kategori texten i vänstra hörnet så blir det som i den bifogade bilden :/
          Attached Files

            Comment

            • voigtann1
              Forumvärd
              • 2001-06-14
              • 8810
              #4
              du har en </td> kvar sen har du span element (som är ett inline-element) runt ett block-element(h3) vilket inte är tillåtet


              XHTML få du sätta HTML och bodyns css höjd till 100% (och nolla deras marginaler) nu har du hela fönstret att kunna positonera andra element, så du kan ju positonera din copyright klass till botten: 0; right: 0; ( http://jsfiddle.net/voigtan/MLd68/ rensat lite html och namngett elementen) du kan rensar ännu mer och få lite struktur i koden så kommer den bli lättare att underhålla i framtiden.
              "det går inte att lära en gammal norrlänning byta namn på irc" - gammalt kinesiskt uttryck

                Comment

                • yOINKfoX
                  Medlem
                  • 2012-04-09
                  • 11
                  #5
                  Jag har (tror jag) fått till hemsidan mer eller mindre efter vad jag var ute efter men nu kan den inte hitta min fil i /fashion/index.html och jag ser att den ligger där och kan inte hitta var problemet ligger?! hjälp?
                  https://www.robinkferm.com

                    Comment

                    • Gildebrand
                      Medlem
                      • 2009-06-06
                      • 918
                      #6
                      Nej filen ligger inte där, då hade det funkat!
                      Kodfabriken - Webb- & apputveckling

                        Comment

                        Previous template Next

                        Oderland

                        Collapse
                        Working...