1. #1

    Registered
    31/12/13
    Location
    Kontich
    Posts
    1
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0

    Hoe maak ik dit responsive?

    Voor een website van mij moet ik dit responsive kunnen maken, maar ik heb geen idd hoe ik dit moet doen.

    Code:
    <div class="container">
    	    <div class="vak1"></div>
            <div class="vak2"></div>
            <div class="vak3"></div>
            <div class="vak4"></div>
            
            
          </div>
    Code:
    .container {
    	margin-right: auto;
    	margin-left: auto;
    	position: relative;
    	height: 456px;
        width: 742px;
    	top: 15%;
    	
    }
    .vak1 {
    	width: 344px;
    	height: 216px;
    	background-color: #666;
    	position: absolute;
    	top: 65px;	
    	left: 0px;
    	float:left;
    }
    .vak2 {
    	width: 230px;
    	height: 129px;
    	background-color: #666;
    	position: absolute;
    	top: 298px;
    	left: 114px;
    	float:left;
    }
    .vak3 {
    	width: 305px;
    	height: 211px;
    	background-color: #666;
    	position: absolute;
    	top: 0px;
    	right: 73px;
    	float:left;
    	
    }
    .vak4 {
    	width: 380px;
    	height: 225px;
    	background-color: #666;
    	position: absolute;
    	bottom: 0;
    	right: 0px;
    	float:left;
    	
    }
    Hoe kan ik hier het best aan beginnen?

    mvg,
    Olivier
    no votes  

  2. #2
    W0utR's Avatar
    Registered
    16/04/08
    Location
    Hong Kong
    Posts
    1,989
    iTrader
    6 (100%)
    Mentioned
    0 Post(s)
    Reputation
    7/9
    Je wilt dat je breedte flexibel is, maar je gebruikt een vaste waarde
    Code:
    width: 742px;
    Hoe begin je hier het best aan? Gebruik een flexibele waarde.
    no votes  

  3. #3
    dJeez's Avatar
    Registered
    17/07/02
    Location
    Sol System
    Posts
    10,064
    iTrader
    1 (100%)
    Mentioned
    0 Post(s)
    Reputation
    27/78
    Quote Originally Posted by W0utR View Post
    This quote is hidden because you are ignoring this member. Show
    Hoe begin je hier het best aan? Gebruik een flexibele waarde.
    En gooi ineens al die absoluut gepositioneerde divs ook maar in de prullenmand dan...
    PSN: dJeezBE - Delicious bookmarks
    Disclaimer: I am currently suffering from severe CSD (Compulsive Sarcasm Disorder). - L'onion fait la farce - Facile largire de alieno
    Pastafarian by choice
    no votes  

  4. #4
    Scissor's Avatar
    Registered
    14/09/02
    Posts
    1,088
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Je kan ook gewoon met mediaqueries werken natuurlijk of met een alternatief stylesheet voor mobile. Dan kan je gerust gebruik maken van niet-flexibele waarden.
    no votes  

  5. #5

    Registered
    22/05/09
    Location
    Geraardsbergen
    Posts
    257
    iTrader
    7 (100%)
    Mentioned
    0 Post(s)
    Al gedacht om een grid te gebruiken?
    no votes  

  6. #6
    sarnath's Avatar
    Registered
    07/11/03
    Location
    Bree
    Posts
    6,239
    iTrader
    158 (99%)
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Ik zou mediaqueries gebruiken...
    CSS3 Media Queries
    webdeveloper / gamer
    no votes  

  7. #7
    woony's Avatar
    Registered
    03/12/03
    Location
    Oostende
    Posts
    2,599
    iTrader
    78 (100%)
    Mentioned
    0 Post(s)
    Reputation
    7/10
    weer 1 die een vraag komt stellen (1post), in de hoop gewoon een oplossing te krijgen, en die verder niet reageert... mja reflectie van de realiteit zeker? bah.. /rant
    no votes  

  8. #8
    KingOfWoods's Avatar
    Registered
    28/07/02
    Location
    Gent
    Posts
    2,195
    iTrader
    19 (91%)
    Mentioned
    0 Post(s)
    Reputation
    0/144
    HTML5 boilerplate
    twitter bootstrap

    google deze effe. Zal u een hele hoop miserie besparen.
    no votes  

  9. #9
    dJeez's Avatar
    Registered
    17/07/02
    Location
    Sol System
    Posts
    10,064
    iTrader
    1 (100%)
    Mentioned
    0 Post(s)
    Reputation
    27/78
    Quote Originally Posted by woony View Post
    This quote is hidden because you are ignoring this member. Show
    weer 1 die een vraag komt stellen (1post), in de hoop gewoon een oplossing te krijgen, en die verder niet reageert... mja reflectie van de realiteit zeker? bah.. /rant
    Greedy people are greedy. Het ergste zijn toch wel de pipo's die GitHub projecten gebruiken en enkel tirades posten als er iets niet werkt, maar zelf niets bijdragen (PRs openen met mogelijke fixes dus).
    PSN: dJeezBE - Delicious bookmarks
    Disclaimer: I am currently suffering from severe CSD (Compulsive Sarcasm Disorder). - L'onion fait la farce - Facile largire de alieno
    Pastafarian by choice
    no votes  

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Log in

Log in