Float og phpbb

Her kan du stille og svare på spørgsmål omkring HTML. Du kan altså med andre ord finde en masse hjælp til HTML og HTML5 på dette forum
Besvar
Brugeravatar
Daniel
Admin
Admin
Indlæg:625
Tilmeldt:14. jun 2011, 09:27
Geografisk sted:Danmark, Fyn, Nørre Aaby
Kontakt:
Float og phpbb

Indlæg af Daniel » 12. aug 2011, 12:09

Hejsa til jer alle sammen. :)

Jeg ved ikke helt hvor jeg skulle skrive dette her, da det hører lidt til over det hele. :)
Jeg er gået i gang med en anden hjemmeside end den tidligere da jeg var nødt til at geninstallerer mit Windows 7 på min computer da det hele havde sat sig fast. :)
Derved mistede jeg også alt det jeg havde lavet på den hjemmeside.
Men nu har jeg så et lille problem, jeg er ved at lave layoutet for den nye side, men jeg kan ikke få to bokse til at sidde ved siden af hinanden, det er meningen at jeg vil have reklamer i de bokse. :)

Billede

Det er de to bokse der går ind i hinanden. :)

Jeg har lavet denne CSS styling for det skulle passe. :)

Kode: Vælg alt

#Reklame1 {
    width: 300px;
    height: 100px;
    margin-left: 40px;
    border-style: solid;
    border-width: thin;
    text-align: center;
    float: left;
}
#Reklame2 {
    width: 300px;
    height: 100px;
    margin-right: 40px;
    border-style: solid;
    border-width: thin;
    text-align: center;
    float: right;
}
Samtidig ville jeg gerne høre om det kan lade sig gøre at få reklamer i de to bokse, altså jeg tænker på at jeg har sat en bestemt størrelse på dem? :)

Jeg håber i kan hjælpe mig. :)

Samtidig med så håbede jeg på at i måske kunne forklare mig hvordan man sætter et plugin ind på en side, i dette tilfælde phpbb? :)

Brugeravatar
webudvikleren
Rutineret
Rutineret
Indlæg:80
Tilmeldt:13. jun 2011, 21:11
Geografisk sted:Esbjerg
Kontakt:

Re: Float og phpbb

Indlæg af webudvikleren » 12. aug 2011, 12:22

Har du prøvet at bytte om på dine 2 DIV'er. Så den som skal floate right står før den til venstre?

Brugeravatar
Daniel
Admin
Admin
Indlæg:625
Tilmeldt:14. jun 2011, 09:27
Geografisk sted:Danmark, Fyn, Nørre Aaby
Kontakt:

Re: Float og phpbb

Indlæg af Daniel » 12. aug 2011, 13:17

Det hade jeg på ingen måde tænkt over kunne være fejlen, tak skal du have. :D

Brugeravatar
Daniel
Admin
Admin
Indlæg:625
Tilmeldt:14. jun 2011, 09:27
Geografisk sted:Danmark, Fyn, Nørre Aaby
Kontakt:

Re: Float og phpbb

Indlæg af Daniel » 13. aug 2011, 02:35

Nu har jeg fået endnu et problem, ved at jeg laver mine links, går der noget galt. :)

Billede

Som i kan se så er linket slet ikke inde i mit div tag, og samtidig med så vil jeg gerne have så teksten i linket står i midten, altså lodret ment. :)
(Fjerner alle kanterne når jeg er færdig, bare til at hjælpe. :) )

Koderne er som følger (HTML):

Kode: Vælg alt

<!DOCTYPE html>
<html>
    <head>
        <title></title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" href="Styles.css" type="text/css"/>
    </head>
    <body>
        <div id="Hoved">
            <div id="Logo">Her skal logoet være!</div>
            <br/>
            <div id="Menu">
            <ul id="ULNavigation">
                <li id="LINavigation"><a href="#" class="NAVigation">Forside</a></li>
                <li id="LINavigation"><a href="#" class="NAVigation">Fisk</a></li>
                <li id="LINavigation"><a href="#" class="NAVigation">Tilbehør</a></li>
                <li id="LINavigation"><a href="#" class="NAVigation">Forum</a></li>
            </ul>
            </div>
            <br/>
            <div id="Reklame2">Her skal der være en reklame!</div>
            <div id="Reklame1">Her skal der være en reklame!</div>
            <div id="Indhold"></div>
        </div>
    </body>
</html>
Koderne er som følger (CSS):

Kode: Vælg alt

#Hoved {
    width: 700px;
    height: 1000px;
    margin-left: auto;
    margin-right: auto;
    border-style: solid;
    border-width: thin;
}
#Logo {
    width: 600px;
    height: 100px;
    margin-left: auto;
    margin-right: auto;
    border-style: solid;
    border-width: thin;
    text-align: center;
}
#Menu {
    width: 650px;
    height: 35px;
    margin-left: auto;
    margin-right: auto;
    border-style: solid;
    border-width: thin;
}
#ULNavigation {
    list-style-type: none;
}
#LINavigation {
    float: left;
}
a.NAVigation:LINK {
    display: block;
    width: 152px;
    height: 35px;
    background-color: #999;
    padding: 0;
    text-align: center;
}
#Reklame1 {
    width: 300px;
    height: 100px;
    margin-left: 40px;
    border-style: solid;
    border-width: thin;
    text-align: center;
    float: left;
}
#Reklame2 {
    width: 300px;
    height: 100px;
    margin-right: 40px;
    border-style: solid;
    border-width: thin;
    text-align: center;
    float: right;
}
#Indhold {
    width: 
}
(Blev aldrig helt færdig med indhold, den skal ikke se sådan ud. :9 )

Brugeravatar
webudvikleren
Rutineret
Rutineret
Indlæg:80
Tilmeldt:13. jun 2011, 21:11
Geografisk sted:Esbjerg
Kontakt:

Re: Float og phpbb

Indlæg af webudvikleren » 13. aug 2011, 09:49

Det er en typisk ting man ofte glemmer.

ul og li har som standard en margin på XX antal pixels. Dette betyder den vil skubbe sig i forhold til ens div.

det du blot skal gøre er at nulstille disse:

ul {
margin:0;
padding:0;
}

ul li {
margin:0;
padding:0;
}

Herefter kan du så gå i krig med at ændre størrelsen på margin og padding så det vises som du ønsker :)

Brugeravatar
Daniel
Admin
Admin
Indlæg:625
Tilmeldt:14. jun 2011, 09:27
Geografisk sted:Danmark, Fyn, Nørre Aaby
Kontakt:

Re: Float og phpbb

Indlæg af Daniel » 13. aug 2011, 11:00

Okay, så det er det der med lige at sidde og prøve sig frem med det, takker mange gange. :)

Brugeravatar
Daniel
Admin
Admin
Indlæg:625
Tilmeldt:14. jun 2011, 09:27
Geografisk sted:Danmark, Fyn, Nørre Aaby
Kontakt:

Re: Float og phpbb

Indlæg af Daniel » 13. aug 2011, 11:45

Det virkede jo bare kanon, takker mange gange, men har lige et spørgsmål om man kan lave sådan at teksten kommer til at stå midt i linket, ligesom her på sidens link? :)
(Jeg mener ikke den med text-align: center; men hvor det er den anden vej det også kommer til at stå i midten.) :)

Brugeravatar
webudvikleren
Rutineret
Rutineret
Indlæg:80
Tilmeldt:13. jun 2011, 21:11
Geografisk sted:Esbjerg
Kontakt:

Re: Float og phpbb

Indlæg af webudvikleren » 13. aug 2011, 17:12

Ja det du ønsker er lidt det jeg betragter som et mareridt, da opsætningen her skal kontrolleres i samtlige browsere, og de reagere forskelligt alle sammen.

Det du skal gøre er at tildele højre og venstre afstand til dine listeelementer sådan:

Kode: Vælg alt

#Menu ul li {
  padding:2px 3px 5px 2px;
}
en anden måde at skrive ovenstående på er:

Kode: Vælg alt

#Menu ul li {
  padding-top: 2px
  padding-right: 3px;
  padding-bottom: 5px;
  padding-left: 2px;
}
Det er "bare" at prøve sig frem. Hvis IE slet ikke vil det du vil, skal du oprette et nyt CSS dokument som kun tolkes af IE.

Brugeravatar
Daniel
Admin
Admin
Indlæg:625
Tilmeldt:14. jun 2011, 09:27
Geografisk sted:Danmark, Fyn, Nørre Aaby
Kontakt:

Re: Float og phpbb

Indlæg af Daniel » 13. aug 2011, 17:18

Hmm, kan ikke få det til at virke med det, når jeg gør som du skriver man skal så rykker jeg bare selve linkene, altså boksen, hvor jeg gerne vil rykke teksten? :)

Brugeravatar
webudvikleren
Rutineret
Rutineret
Indlæg:80
Tilmeldt:13. jun 2011, 21:11
Geografisk sted:Esbjerg
Kontakt:

Re: Float og phpbb

Indlæg af webudvikleren » 14. aug 2011, 11:33

Ahh på teksten..! Nu hvor alt indhold i dine li er links skulle det være muligt blot at tilføje et a efter det eksisterende:

Kode: Vælg alt

#Menu ul li a {
  padding:2px 3px 5px 2px;
}
Dur det?

Besvar