Avatar billede lurup Ekspert
20. september 2016 - 01:25 Der er 8 kommentarer og
1 løsning

indlæse side

Håber på lidt hjælp her

Jeg skal have skema.php ind i kassen der hedder skema ??
Den kommer ind i kassen top.

håber på hjælp

allanurup.dk/start2

<html>
<head>
  <title>CSS Layout demo</title>
  <style type="text/css">
  body { Margin: 0; Padding: 0px; }
    .main { Height: 1080px; Width: 1920px;Float: left; }
  #header { Height: 0px;Width: 0px; }

  #dato { Height: 207px;Width: 631px; margin-top: 0px;margin-left: 0px;
                border-right: 3px solid silver;
                border-left: 6px solid silver;
                border-top: 6px solid silver;
                border-bottom: 3px solid silver;}
 
  #skema { Height: 696px;Width: 631px; margin-top: 216px;margin-left: -640px;
                border-right: 3px solid silver;
                border-left: 6px solid silver;
                border-top: 3px solid silver;
                border-bottom: 3px solid silver;}
               
  #vagt { Height: 153px;Width: 631px; margin-top: 918px;margin-left: -640px;

                border-right: 3px solid silver;
                border-left: 6px solid silver;
                border-top: 3px solid silver;
                border-bottom: 6px solid silver;}

#top { Height: 531px;Width: 1271px; margin-top: -1080px;margin-left: 640px;     

                border-right: 6px solid silver;
                border-left: 3px solid silver;
                border-top: 6px solid silver;
                border-bottom: 3px solid silver;}

#bund { Height: 531px;Width: 1271px; margin-top: -540px;margin-left:638px;     

                border-right: 3px solid silver;
                border-left: 6px solid silver;
                border-top: 3px solid silver;
                border-bottom: 6px solid silver;}
html, body{
           
            height:25%;
            }
            body{
                font-family:'Comic Sans MS', Comic, Monospace;
           
    background-image: url("bg1.gif");
   
            }


  </style>
</head>

<body>
  <div class="area" id="header"></div>
  <div class="main area" id="dato">dato</div>
  <div class="main area" id="skema">skema</div>
  <div class="main area" id="vagt">vagt</div>
  <div class="main area" id="top">top</div>
  <div class="main area" id="bund">bund</div>
 
<div id="skema>skema">
  <?php
    require('skema.php');
    ?> 
</div>



</body>
</html>
Avatar billede Slater Ekspert
20. september 2016 - 07:01 #1
"skema>skema" er ikke et korrekt id. Og hvis du retter det til skema, har du to id'er med samme navn, hvilket ikke er tilladt.

Ser ud som om det skal restruktureres lidt. Evt. bruge nogle klasser i stedet for så mange id'er.
Avatar billede lurup Ekspert
20. september 2016 - 10:06 #2
ok...

Kan du hjælpe lidt med det ?
Avatar billede olsensweb.dk Ekspert
20. september 2016 - 11:08 #3
>Jeg skal have skema.php ind i kassen der hedder skema ??
se hvad jeg gjorde i denne
http://www.computerworld.dk/eksperten/spm/1012705?k=8232352
i de grå boxe


<body>
  <div class="area" id="header"></div>
  <div class="main area" id="dato">dato</div>
  <div class="main area" id="skema">
    <?php
    require('skema.php');
    ?>
 
  </div>
  <div class="main area" id="vagt">vagt</div>
  <div class="main area" id="top">top</div>
  <div class="main area" id="bund">bund</div>
</body>


analyser det du har lavet tidligere og tag ved lære at det.

hvad bruger du klassen area til ??
at bruge minus margin er ikke ligefrem optimalt.
så som Slater skriver "Ser ud som om det skal restruktureres lidt."


>Den kommer ind i kassen top.
Nej, den kommer helt uden for din box,
læs på box modellen.
brug udviklings værktøjet i din browser
Avatar billede lurup Ekspert
21. september 2016 - 02:24 #4
Hej igen

Er kommet godt videre
allanurup.dk/ramme23

Har brug for hjælp til hvorfor mine 2 bokse i højre side står under de andre 3 og ikke ved siden af ??

<!DOCTYPE html>
<html lang="da">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>dhealm</title>
        <style type="text/css">

       
            html, body{
           
            height:100%;
            }
            body{
                font-family:'Comic Sans MS', Comic, Monospace;
           
  //  background-image: url("bg1.gif");
   
            }
            #col_left1{

              background-color: yellow;
                width: 33.3%;
                float: top;
              height: 20%;
               

                    border-right: 6px solid #767676;
                border-left: 6px solid #767676;
                border-top: 6px solid #767676;
                border-bottom: 6px solid #767676;
            }

            #col_left2{
                background-color: red;
              width: 33.3%;
                float: down;
                height: 65%;
             
                border-right: 6px solid black;
                border-left: 6px solid black;
                border-top: 6px solid black;
                border-bottom: 6px solid black;
           
            }

                #col_left3{
                background-color: green;
              width: 33.3%;
           
                height: 15%;
             
                  border-right: 6px solid blue;
                border-left: 6px solid blue;
                border-top: 6px solid blue;
                border-bottom: 6px solid blue;
           
            }


             
           
            }

          #col_right{               
               
           
            }
            /* http://stackoverflow.com/questions/5277161/why-is-min-height-not-working */
            #top{
                float: right;
                background-color: yellow;
              width: 65%; height:50%;

            }
            #bund{
                float: right;
                background-color: green;
                width: 65%; height:50%;
            }
        </style>       
    </head>
    <body>
     

<div id="col_left1">
    <?php
    require('ss.php');
    ?>
</div>


<div id="col_left2">
  <?php
  require('ss.php');
    ?>
</div>

<div id="col_left3">
  <?php
  require('ss.php');
  ?>
  </div>



        <div id="top">
        <?php
  require('ss.php');
  ?>
  </div>
   


<div id="bund">
    <?php
    require('ss.php');
    ?>
</div>
        </div>
    </body>
</html>
Avatar billede olsensweb.dk Ekspert
21. september 2016 - 06:58 #5
#4
>Har brug for hjælp til hvorfor mine 2 bokse i højre side står under de andre 3 og ikke ved siden af ??
kunne være et plads problem (box modellen)
kunne være et float problem


hvor har du disse fra:
float: top;
float: down;
 
ved float kan du kun bruge left og right

der er iøvrigt også en HTML fejl,



hvis du gider kører den gennem https://validator.w3.org
vil du se der er HTML fejl
ref https://validator.w3.org/nu/?doc=http%3A%2F%2Fallanurup.dk%2Framme23
Error: Stray end tag div.
From line 104, column 9; to line 104, column 14
>    </div>    <


hvis du gider kører din CSS den gennem http://jigsaw.w3.org/css-validator/
vil du se der er CSS fejl
ref http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fallanurup.dk%2Framme23&profile=css3&usermedium=all&warning=1&vextwarning=&lang=en
10    body    Parse Error // background-image: url("bg1.gif");
12    body    Parse Error }
30    #col_left2    Value Error : float down is not a float value : down
56        Parse Error }
Avatar billede olsensweb.dk Ekspert
21. september 2016 - 07:11 #6
coden ligner et float problem

hint float right skulle måske være float left (utested)
Avatar billede olsensweb.dk Ekspert
21. september 2016 - 07:34 #7
det nemmeste er at lave 2 collonner, (col_left, og col_right) og floate den, (float left)
og inde i dem lave de henholdsvis 3 og 2 boxe
Avatar billede lurup Ekspert
21. september 2016 - 16:39 #8
Syntes selv det går lidt frem af takke være hjælp herfra.  TAK

Har lavet lidt om men stadig problemer med at få top og bund på plads i højre side ?
Avatar billede lurup Ekspert
21. september 2016 - 16:39 #9
<!DOCTYPE html>
<html lang="da">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <title>dhealm</title>
        <style type="text/css">

       
            html, body{
           
            height:100%;
            }
            body{
                font-family:'Comic Sans MS', Comic, Monospace;
           
 
   
            }
      #col_left{             
               
           
            }
            /* http://stackoverflow.com/questions/5277161/why-is-min-height-not-working */
            #col_left1{
                float: left;
                background-color: yellow;
                height:20%;
                width: 33%;

            }
            #col_left2{
                float: none;
                background-color: green;
                height:65%;
                width: 33%;
            }
           
            #col_left3{
                float: none;
                background-color: blue;
                height:15%;
                width: 33%;
            }

          #col_right{               
                 
            }


            /* http://stackoverflow.com/questions/5277161/why-is-min-height-not-working */
            #top{
                float: right;
              background-color: yellow;
              width: 65%; height:50%;
            }
            #bund{
                float: right;
                background-color: green;
                width: 65%; height:50%;
            }
        </style>       
    </head>
    <body>
     

<div id="col_left1">
    <?php
    require('ss.php');
    ?>
</div>


<div id="col_left2">
  <?php
  require('ss.php');
    ?>
</div>
<div id="col_left3">
  <?php
  require('ss.php');
  ?>
  </div>
        <div id="top">
        <?php
  require('ss.php');
  ?>
  </div>
   
<div id="bund">
    <?php
    require('ss.php');
    ?>
</div>
          </body>
</html>
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
Vi tilbyder markedets bedste kurser inden for webudvikling

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