Pagina 1 van 2 12 LaatsteLaatste
Weergegeven resultaten: 1 t/m 10 van 19
  1. #1
    Up-to-date  
    Geregistreerd
    7 september 2009
    Berichten
    46
    Bedankjes
    20
    Bedankt
    54 keer in 18 posts

    Container staat niet op volledig scherm

    Ik ben net begonnen aan een website, helemaal geprogrammeerd en volgens de standaarden.
    Ik heb enkel één probleem:

    Mijn container staat op 100% breedte en hoogte maar toch wil die op grote computerschermen niet over heel mijn website staan. Op mijn laptop wordt die goed weergegeven, maar op mijn vaste niet?

    Kan iemand me vlug uit de nood helpen aub?

  2. #2
    Expert   Butterflyice's schermafbeelding
    Geregistreerd
    9 juni 2006
    Berichten
    632
    Bedankjes
    34
    Bedankt
    583 keer in 373 posts
    linkje of je code ?
    PHP-code:
    function handleException($e) { echo $e->getMessage(); }
            
    set_exception_handler("handleException");
                throw new 
    Exception("There is always a way");
            echo 
    "You caught me!"

  3. #3
    Up-to-date  
    Geregistreerd
    7 september 2009
    Berichten
    46
    Bedankjes
    20
    Bedankt
    54 keer in 18 posts
    Ok komt er aan:

    mijn container staat op grote schermen gewoon niet op heel het scherm.

    @charset "UTF-8";
    /* CSS Document */


    body
    {
    background-color: #333333;
    }


    #container
    {
    overflow: auto;
    }


    #top
    {
    width: 100%;
    background-image: url('../images/top.png');
    height: 130px;
    }


    #menu
    {
    width: 782px;
    height: 50%;
    margin-left: auto;
    margin-right: auto;
    padding-top: 3px;
    }


    #menu li
    {
    display: inline;
    padding-left: 10px;
    }


    #menu ul li a:link, #menu ul li a:visited, #menu ul li a:hover, #menu ul li a:active
    {
    text-decoration: none;
    color: white;
    font-size: 18px;
    font-family: Helvetica;
    height: 27px;
    line-height: 25px;
    display: inline;
    }


    #logo
    {
    width: 960px;
    background-image: url('../images/logo.png');
    background-repeat: no-repeat;
    height: 110px;
    margin-left: auto;
    margin-right: auto;
    margin-top: -88px;
    }


    #wolk1
    {
    width: 100px;
    background-image: url('../images/wolk1.jpg');
    background-repeat: no-repeat;
    height: 60px;
    margin-left: 40px;
    margin-top: -100px;
    }


    #wolk2
    {
    width: 100px;
    background-image: url('../images/wolk2.jpg');
    background-repeat: no-repeat;
    height: 60px;
    float: right;
    margin-right: 40px;
    margin-top: -60px;
    }




    #header
    {
    width: 752px;
    height: 328px;
    background-image: url('../images/web1.png');
    background-repeat: no-repeat;
    margin-top: 18px;
    border: 4px solid #cc6633;
    border-top: none;
    margin-left: auto;
    margin-right: auto;
    }


    #title
    {
    width: 752px;
    height: 30px;
    background-color: white;
    margin-left: auto;
    margin-right: auto;
    border: 4px solid #99cccc;
    margin-top: 20px;
    margin-bottom: 20px;
    padding-top: 13px;
    }


    #title h1
    {
    font-size: 22px;
    font-family: Trebuchet MS, sans serif;
    font-weight: bold;
    padding-left: 15px;
    }


    #content
    {
    width: 752px;
    height: auto;
    background-color: white;
    margin-left: auto;
    margin-right: auto;
    border: 4px solid #99cccc;
    margin-top: 20px;
    margin-bottom: 20px;
    }


    #content p
    {
    font-size: 14px;
    font-family: Trebuchet MS, sans serif;
    line-height: 12pt;
    padding-left: 15px;
    padding-bottom: 20px;
    }




    .first
    {
    font-size: 14px;
    font-family: Helvetica, sans serif;
    line-height: 10px;
    padding-left: 15px;
    padding-top: 20px;
    }


    #block
    {
    width: 100%;
    height: auto;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 0px;
    background-image: url('../images/footer.png');
    background-repeat: repeat-x;
    }


    #footer
    {
    width: 752px;
    height: 180px;
    margin-left: auto;
    margin-right: auto;
    }


    #navigeren
    {
    width: 305px;
    height: 180px;
    float: left;
    }


    #navigeren h1
    {
    color: white;
    font-size: 25px;
    padding-bottom: 5px;
    padding-top: 20px;
    }


    #navigeren ul li a:link, #navigeren ul li a:visited, #navigeren ul li a:hover, #navigeren ul li a:active
    {
    text-decoration: none;
    color: white;
    font-size: 18px;
    height: 27px;
    line-height: 25px;
    }


    #socialmedia
    {
    width: 221px;
    height: 180px;
    float: left;
    }


    #socialmedia h1
    {
    color: white;
    font-size: 25px;
    padding-bottom: 5px;
    padding-top: 20px;
    padding-bottom: 20px;
    }


    #monsters
    {
    width: 200px;
    height: 160px;
    margin-top: 20px;
    background-image: url('../images/monster.png');
    background-repeat: no-repeat;
    float: right;
    }
    Laatst gewijzigd door Visaversa; 27 november 2011 om 19:32

  4. #4
    Up-to-date  
    Geregistreerd
    7 september 2009
    Berichten
    46
    Bedankjes
    20
    Bedankt
    54 keer in 18 posts
    Hier is de XHTML ook:

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
    <link rel="stylesheet" type="text/css" href="css/reset.css" />
    <link rel="stylesheet" type="text/css" href="css/screen.css" />
    <title>Portfolio</title>
    </head>


    <body>
    <div id="container">
    <div id="top">
    <div id="menu">
    <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Skills</a></li>
    <li><a href="#">Web</a></li>
    <li><a href="#">Fotografie</a></li>
    <li><a href="#">Contact</a></li>
    </ul>
    </div> <!--end menu-->
    </div><!-- end top-->
    <div id="logo">
    </div><!--end logo-->
    <div id="wolk1">
    </div><!-- end wolk1-->
    <div id="wolk2">
    </div><!--end wolk2-->
    <div id="header">
    </div><!--end header-->
    <div id="title">
    <h1>Hi There!</h1>
    </div><!-- end title-->
    <div id="content">
    </div><!-- end content-->
    <div id="block">
    <div id="footer">
    <div id="navigeren">


    <h1>Snel navigeren</h1>


    <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Skills</a></li>
    <li><a href="#">Web</a></li>
    <li><a href="#">Fotografie</a></li>
    <li><a href="#">Contact</a></li>
    </ul>
    </div><!-- end navigeren-->
    <div id="socialmedia">
    <h1>Sociale media</h1>
    <img src="images/facebook.png" alt="facebook"/>
    <img src="images/linkedin.png" alt="linkedin"/>
    <img src="images/twitter.png" alt="twitter"/>
    </div><!--end socialmedia-->
    <div id="monsters">
    </div><!---end monsters-->
    </div><!--end footer-->
    </div><!--end block-->
    </div><!-- end container-->
    </body>
    </html>

  5. #5
    Expert   Butterflyice's schermafbeelding
    Geregistreerd
    9 juni 2006
    Berichten
    632
    Bedankjes
    34
    Bedankt
    583 keer in 373 posts
    Je css van je container bevat alleen een overflow en geen width

    Code:
    #container
     {
     overflow: auto;
     }
    ps gebruik de volgende keer code tags als e code plaatst
    PHP-code:
    function handleException($e) { echo $e->getMessage(); }
            
    set_exception_handler("handleException");
                throw new 
    Exception("There is always a way");
            echo 
    "You caught me!"

  6. #6
    Up-to-date  
    Geregistreerd
    7 september 2009
    Berichten
    46
    Bedankjes
    20
    Bedankt
    54 keer in 18 posts
    Het probleem is nog niet van de baan. Ik blijf mijn achtergrond steeds achter mijn footer zien als ik op een groter scherm zit.

    Ik merk wel op dat het op safari werkt.
    Firefox en Chrome doen het nog niet.

    Hier kan je zien wat ik bedoel:

    Laatst gewijzigd door Visaversa; 28 november 2011 om 00:04

  7. #7
    Up-to-date  
    Geregistreerd
    7 september 2009
    Berichten
    46
    Bedankjes
    20
    Bedankt
    54 keer in 18 posts
    Opgelost!

    Ik heb de container een relatieve positie meegegeven, mijn footer een absolute positie meegegeven en dan heb ik die positie een bottom meegegeven die op 0 en auto staat.

  8. #8
    Up-to-date  
    Geregistreerd
    7 september 2009
    Berichten
    46
    Bedankjes
    20
    Bedankt
    54 keer in 18 posts
    Te vroeg gejuigd, het was beter in Firefox, maar het probleem doet zich nog steeds voor!

  9. #9
    Expert   Butterflyice's schermafbeelding
    Geregistreerd
    9 juni 2006
    Berichten
    632
    Bedankjes
    34
    Bedankt
    583 keer in 373 posts
    Kan je alles in een zipje doen dus incl de afbeeldingen en een screenshot wa je anders wilt hebben.
    Dan kunnen we het fixen voor je.
    PHP-code:
    function handleException($e) { echo $e->getMessage(); }
            
    set_exception_handler("handleException");
                throw new 
    Exception("There is always a way");
            echo 
    "You caught me!"

  10. De volgende gebruiker bedankt Butterflyice voor deze nuttige post:

    Visaversa (28 november 2011)

  11. #10
    Up-to-date  
    Geregistreerd
    7 september 2009
    Berichten
    46
    Bedankjes
    20
    Bedankt
    54 keer in 18 posts
    Oké doe ik,..Het is de bedoeling dat de footer steeds beneden komt en er niet al te veel plaats komt tussen content en footer. Screenshots, CSS files en HTML bestanden zitten in de downloadlink.

    Ik ben benieuwd, want ik zoek me maar te pletter :(

    https://rapidshare.com/files/2235004186/Bestanden.zip
    Laatst gewijzigd door Visaversa; 28 november 2011 om 22:39

  12. De volgende gebruiker bedankt Visaversa voor deze nuttige post:

    compuchrisje (28 november 2011)

Discussie informatie

Users Browsing this Thread

Momenteel bekijken 1 gebruikers deze discussie. (0 leden en 1 gasten)

Soortgelijke discussies

  1. windows 2000 en geen volledig scherm
    Door alpha in forum Windows
    Reacties: 9
    Laatste bericht: 8 februari 2009, 12:03
  2. site niet meer volledig te zien
    Door Sarana in forum Internet
    Reacties: 2
    Laatste bericht: 20 maart 2007, 21:37
  3. beeldscherm gaat niet alleen tv scherm
    Door icy in forum Grafische kaarten & monitors
    Reacties: 2
    Laatste bericht: 17 november 2006, 19:11
  4. Webcam staat niet als standaart op msn
    Door kurt0015 in forum Audiovisueel
    Reacties: 1
    Laatste bericht: 28 januari 2006, 19:46
  5. Telemeter staat NIET op nul
    Door Filiberken in forum Internet
    Reacties: 1
    Laatste bericht: 3 januari 2006, 21:08

Favorieten/bladwijzers

Favorieten/bladwijzers

Regels voor berichten

  • Je mag geen nieuwe discussies starten
  • Je mag niet reageren op berichten
  • Je mag geen bijlagen versturen
  • Je mag niet je berichten bewerken
  •