Avatar billede tobrukDk Novice
15. januar 2012 - 12:05 Der er 7 kommentarer og
1 løsning

tekst kommer over boxen

Hej


det er sådan at jeg er i gang med at lave en hjemmeside til bruger system men det er sådan at når man klik inde på bruger osv. så kommer tekst ude over boxen så det ser "grimt".


#djbox {
    width:300px;
    min-height:325px;
    margin:5px;
    background:#CCC;
    float:left;
   
    border-radius:7px;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
}
#djbox a {
    text-decoration:none;
    color:#000;
}
#djbox a:hover {
    border-bottom:1px #000 solid;
    text-decoration:none;
    color:#00F;
}
#djnavn {
    background:url(../img/bruger/top-navn.png) repeat-x #F90;
    padding:4px;
   
    border-top-left-radius:7px;
    border-top-right-radius:7px;
    -moz-border-radius-topleft:7px;
    -moz-border-radius-topright:7px;
    -webkit-border-top-right-radius:7px;
    -webkit-border-top-left-radius:7px;
}
#djnavn li {
    margin:1px;
    list-style-image:url(../img/bruger/music-icon.png);
}
#djtekst {
    padding:2px;
    margin:5px;
    height:250px;
}
        #faceicon {
            list-style-image:url(../img/bruger/FaceBook-icon.png);
            margin:4px;
            float:left;
        }
        #webicon {
            list-style-image:url(../img/bruger/site.png);
            margin:4px;
            float:left;
        }
        #landicon {
            list-style-image:url(../img/bruger/verden.png);
            margin:4px;
            float:left;
        }
h2 {
    color:#FFF;
    background:#999;
    padding:5px;
   
    border-radius:7px;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
}
#profilinfo {
    float:left;
    background:#CCC;
    padding:10px;
    margin:2px;
    border:1px #000 solid;
   
    border-radius:7px;
    -moz-border-radius:7px;
    -webkit-border-radius:7px;
}

http://localhostr.com/files/37VTk1j/capture.png
sådan ser det ud men hvad har jeg gøre galt siden det vise sig sådan. kan man ikke gøre sådan at sæt et max på det og så vise den kun det eller hvad?,, kan man gøre med det?



<div id="djbox">
        <!--Djnavn-->
            <div id="djnavn">
                <li><a href="profil.php?djz=<?php echo $row["id"];?>"><?php echo $row["djnavn"];?></a></li>
            </div>
            <!--profiltekst-->
                <div id="djtekst">
                    <?php echo $row["profiltekst"];?>
                </div>
                <!--website-facebook-->
                    <li id="faceicon"><a href="http://www.facebook.com/pages/<?php echo $row["facebook"];?>" target="_blank">Fan side</a></li>
                    <li id="webicon"><a href="<?php echo $row["site"];?>" target="_blank">Website</a></li>
                    <li id="landicon"><?php echo $row["land"];?></li>
        </div>       
        <?php
        }       
        ?>


sådan ser kode ud når det er :)

hvad kan jeg gøre så det ser rigtigt godt ud da :)
Avatar billede Herover Nybegynder
15. januar 2012 - 12:30 #1
Prøv at fjerne width:250px fra #djtekst, eller tilføj overflow-y:scroll;
Avatar billede Herover Nybegynder
15. januar 2012 - 12:32 #2
Fjerner du "width" fra djtekst får du mulighvis også lyst til at fjerne den fra djbox. Det er (efter min mening) bedst at lade browseren selv sætte størrelsen af din box alt efter indholdets størrelse.
Avatar billede tobrukDk Novice
15. januar 2012 - 12:59 #3
http://localhostr.com/files/2zeQb1k/capture.png

så kommer det til at se sådan her ud :(
Avatar billede DeeDawg Nybegynder
15. januar 2012 - 13:36 #4
Først og fremmest, må dette aldrig ske

<div id="djnavn">
    <li><a href="profil.php?djz=<?php echo $row["id"];?>"><?php echo $row["djnavn"];?></a></li>
</div>

<!--website-facebook-->
<li id="faceicon"><a href="http://www.facebook.com/ (...) echo $row["facebook"];?>" target="_blank">Fan side</a></li>
<li id="webicon"><a href="<?php echo $row["site"];?>" target="_blank">Website</a></li>
<li id="landicon"><?php echo $row["land"];?></li>

Siden vil ikke validere, da det heller ikke giver mening at definere et <li> (list item) element uden for enten et <ol> eller <ul> element.

Derudover tror jeg, at Herover mener height og ikke width, da dette ikke er defineret for #djtekst.

Altså, hvis du fjerner

height:250px;

Så skulle du gerne få det ønskede resultat, og du behøver derfor ikke at bruge

overflow-y: scroll;


Men på det seneste billede, ser det ud til at du godt selv fangede det med height og width, så hvis det er mere galt, må du forklare nærmere. :)
Avatar billede tobrukDk Novice
15. januar 2012 - 13:50 #5
okay jeg prøve lige at kigge på det men hvis jeg skriver ol eller ul så kommer den frem med sådan her ;

http://localhostr.com/files/LxqG650/capture.png
Avatar billede tobrukDk Novice
15. januar 2012 - 13:59 #6

overflow-y: scroll;

kan man ikke gøre sådan at den har en max?
Avatar billede tobrukDk Novice
15. januar 2012 - 17:41 #7
jeg har lyst problem og klart det. så jeg lukker selv samtale :)
Avatar billede tobrukDk Novice
15. januar 2012 - 17:56 #8
Lukker nu !
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