WN

WN (https://www.wn.se/forum/index.php)
-   Allmänt (https://www.wn.se/forum/forumdisplay.php?f=2)
-   -   Simpel hjälp med html + css kodning. (https://www.wn.se/forum/showthread.php?t=1044497)

kCAB 2010-10-26 20:01
Simpel hjälp med html + css kodning.
 
Jag har problem med att få en box att hamna rätt.

http://data.fuskbugg.se/dipdip/_help2.jpg

Det är dit jag vill att boxen ska hamna.


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

<html>

        <head>
       
                <title>Hem - Lalala</title>
                <link href="style.css" rel="stylesheet" type="text/css">
               
        </head>

       
        <body>
       
                [B]<div id="box">[/B]
                       
                        <div id="container-box-top">
                       
                        </div>
                       
                        <div id="container-box">
                       
                       
                                <div id="header">
                                </div>
                               
                               
                                <div id="meny">
                                        <a href="index.html" class="meny">STARTSIDA</a>
                                        <a href="psykoterapi.html" class="meny2"><font color="white">PSYKOTERAPI</font></a>
                                        <a href="hurgardettill.html" class="meny3">HUR GÅR DET TILL</a>
                                        <a href="ommig.html" class="meny4">OM MIG</a>
                                        <a href="kontakt.html" class="meny5">KONTAKT</a>
                                </div>
                               
                               
                                        <div id="container-top">
                                               
                                        </div>
                                       
                                        <div id="content">
               
                                        </div>
                                       
                                       
                                        <div id="container-bot">
                                       
                                        </div>
                               
                        </div>
                       
                        <div id="container-box-bot">
                        </div>
                       
                [B]</div>[/B]
               
                [B]<div id="box2">[/B]

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

                        <div id="container2">
                        </div>

                        <div id="container2-bot">
                        </div>

                [B]</div>[/B]
               
        </body>

</html>

Kod:
#box1{
        width: 625px;
        min-height: 800px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 30px;
        border: 1px solid black;
}

#box2{
        width: 250px;
        min-height: 400px;
        height: auto;
        float: left;
        border: 1px solid black;
}

P3N 2010-10-26 20:17
Hepp, lägg en div runt allt med id "wrapper".

CSS=
#wrapper{
width: 900px;
min-height: 800px;
margin-left: auto;
margin-right: auto;
margin-top: 30px;
}
#box{
width: 625px;
min-height: 800px;
float: left;
border: 1px solid black;
}

#box2{
width: 250px;
min-height: 400px;
height: auto;
float: right;
border: 1px solid black;
}

kCAB 2010-10-26 20:24
Det hjälpte tyvärr ingenting. :(

P3N 2010-10-26 20:28
Kod:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

<html>

        <head>
       
                <title>Hem - Lalala</title>
                <link href="style.css" rel="stylesheet" type="text/css">
               
        </head>

       
        <body>
        <div id='wrapper'>
                <div id="box">
                       
                        <div id="container-box-top">
                       
                        </div>
                       
                        <div id="container-box">
                       
                       
                                <div id="header">
                                </div>
                               
                               
                                <div id="meny">
                                        <a href="index.html" class="meny">STARTSIDA</a>
                                        <a href="psykoterapi.html" class="meny2"><font color="white">PSYKOTERAPI</font></a>
                                        <a href="hurgardettill.html" class="meny3">HUR GÅR DET TILL</a>
                                        <a href="ommig.html" class="meny4">OM MIG</a>
                                        <a href="kontakt.html" class="meny5">KONTAKT</a>
                                </div>
                               
                               
                                        <div id="container-top">
                                               
                                        </div>
                                       
                                        <div id="content">
               
                                        </div>
                                       
                                       
                                        <div id="container-bot">
                                       
                                        </div>
                               
                        </div>
                       
                        <div id="container-box-bot">
                        </div>
                       
                </div>
               
                <div id="box2">

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

                        <div id="container2">
                        </div>

                        <div id="container2-bot">
                        </div>

                </div>
               
        </div>
        </body>

</html>
Kod:
#wrapper{
        width: 900px;
        min-height: 800px;
        margin-left: auto;
        margin-right: auto;
        margin-top: 30px;
}
#box{
        width: 625px;
        min-height: 800px;
        float: left;
        border: 1px solid black;
}

#box2{
        width: 250px;
        min-height: 400px;
        height: auto;
        float: right;
        border: 1px solid black;
}

Monkboll 2010-10-26 20:31
float: left ska va på box 1 och inte 2?


Alla tider är GMT +2. Klockan är nu 08:58.

Programvara från: vBulletin® Version 3.8.2
Copyright ©2000 - 2025, Jelsoft Enterprises Ltd.
Svensk översättning av: Anders Pettersson