1. #1

    Registered
    30/04/11
    Location
    Alken
    Posts
    55
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0

    Achter de tabel...

    Hoi,

    Ik probeer om de de kerel met de blauwe zonnebril, wanneer men over de afbeelding zweeft, iets meer naar links laten te bewegen.
    Dat lukt goed, het enige probleem is dat hij niet achter de tabel blijft.
    Het werkt WEL naar behoren in Opera.

    Weet iemand hoe ik dit kan oplossen?

    Ohja en ik weet dat de website lelijk is ;D hij is nog lang niet af.

    De URL:

    http://hkj5f6f.atwebpages.com/


    Cheers!
    no votes  

  2. #2
    Ex0dus's Avatar
    Registered
    15/09/02
    Location
    Hyperion
    Posts
    1,103
    iTrader
    1 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/1
    Hey,

    Als ik jou was zou ik niet meer met tables werken om je website te stylen, tables dienen namelijk voor tabulaire data, etc...
    Om te stylen gebruik je div's, pre anno 2000 gebruikte ze wel tables om te stylen daar er geen div's bestonden.

    Om te beginnen pas je enkele zaken aan in je html:
    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
    <html>
    <head>
    	<title></title>
    	<link rel="stylesheet" type="text/css" href="styles.css">
            <link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
    </head>
    <body>
    	<div id="container">
        <div class="lukas"><img src="images/lukas.png"></div>
    	<table align="center" border="0" cellpadding="0" cellspacing="0" width="700" class="body">
    		<tr>
    			<td colspan="4" align="center" height="30" width="700"></td>
    		</tr>
    		<tr>
    			<td rowspan="5" width="25"></td>
    			<td align="center" height="400" width="650" colspan="2">
    				<img src="images/logo.png" align="center">
    			</td>
    			<td rowspan="5" width="25"></td>
    		</tr>
    		<tr>
    			<td align="center" height="45" colspan="2">
    				<iframe src="nav.html" height="45" width="650" margin="0" padding="0" frameborder="0" scrolling="no"></iframe>
    			</td>
    		</tr>
    		<tr>
    			<td align="center" height="*" colspan="2">
    <!-- Content -->
    <!-- End content -->
    			</td>
    		</tr>
    		<tr>
    			<td height="50" colspan="2"></td>	
    		</tr>
    		<tr>
    			<td height="50" width="325" align="center" class="foot">
    				<a href="http://www.mozilla.org/firefox?WT.mc_id=aff_en01&WT.mc_ev=click" target="_blank"><img src="http://www.mozilla.org/contribute/buttons/110x32arrow_b.png" alt="Firefox Download Button" border="0" class="a"/></a>	
         			</td>
    			<td width="325" align="center" class="foot">
    				<a href="http://www.cyanfishwebdesign.co.cc" target="_blank"><img src="http://www.9lives.be/forum/images/cyanfish.png" class="a" alt="Cyan Fish Webdesign &copy;"/></a>
    			</td>
    		</tr>
    	</table>
    	</div>
    </body>
    </html>
    Zoals je kan zien heb ik <div class="lukas"> uit je table gehaald en in een containing div (<div id="container">) geplaatst, ook je table wordt hierin gewrapped.

    Vervolgens de CSS (vervang gewoon 'div.lukas' en 'div.lukas:hover' met onderstaande):
    Code:
    #container {
    	margin: 0 auto;
    	width: 700px;
    	position: relative;
    }
    
    div.lukas
    {
    	position: absolute;
    	bottom: 0px;
    	right: -90px;
    	transition: right 0.25;
    	-moz-transition: right 0.25s;
    	-webkit-transition: right 0.25s;
    	-o-transition: right 0.25s;
    }
    
    div.lukas:hover
    {
           right: -275px;
    }
    En nogmaals, ik raad je af om tables te gebruiken bij het ontwerpen van een site.
    Last edited by Ex0dus; 14-07-2011 at 22:18.
    no votes  

  3. #3

    Registered
    14/08/10
    Location
    Diest
    Posts
    2,419
    iTrader
    1 (100%)
    Mentioned
    0 Post(s)
    Reputation
    8/16
    Goei al die tables inderdaad weg. Wat jij wil kan heel gemakkelijk met bv css3 (of 'gewone' css als je geen animatie wilt maar gewoon een verschuiving)
    no votes  

  4. #4

    Registered
    30/04/11
    Location
    Alken
    Posts
    55
    iTrader
    0
    Mentioned
    0 Post(s)
    Reputation
    0/0
    Quote Originally Posted by Ex0dus View Post
    This quote is hidden because you are ignoring this member. Show
    Hey,

    Als ik jou was zou ik niet meer met tables werken om je website te stylen, tables dienen namelijk voor tabulaire data, etc...
    Om te stylen gebruik je div's, pre anno 2000 gebruikte ze wel tables om te stylen daar er geen div's bestonden.

    Om te beginnen pas je enkele zaken aan in je html:
    ....

    Zoals je kan zien heb ik <div class="lukas"> uit je table gehaald en in een containing div (<div id="container">) geplaatst, ook je table wordt hierin gewrapped.

    Vervolgens de CSS (vervang gewoon 'div.lukas' en 'div.lukas:hover' met onderstaande):

    ...

    En nogmaals, ik raad je af om tables te gebruiken bij het ontwerpen van een site.
    Bedankt! Ik heb vandaag nog een thread gepost om mijn 2 allereerste websites na te kijken en daar raadden ze het mij ook al af om tabellen te gebruiken
    Bedankt voor je raad, ik zal het zeker toepassen!
    Last edited by wocypke; 15-07-2011 at 15:21.
    no votes  

  5. #5
    ns_ripper's Avatar
    Registered
    18/08/02
    Location
    Aarschot
    Posts
    2,343
    iTrader
    105 (100%)
    Mentioned
    0 Post(s)
    Reputation
    0/13
    Ik kan het niet genoeg benadrukken, en wat mijn voorgangers hierboven ook al zeiden. Tables dienen niet voor layout maar voor tabular data.

    Ik wil de discussie xhtml/html nog in het midden laten maar gebruik zeker div's.
    het is echt niet moeilijker dan tables eens je het wat in de vingers hebt zitten. Oefen wat met een paar opzetten. paar eenvoudige pagina's om aan het boxing model te wennen en je bent er zo mee weg. (bvb aantal divs onder elkaar en in het middelste gedeelte een aantal naast elkaar).

    Probeer altijd de flow van de pagina te werken en zo min mogelijk met position absolute. Elke zichzelf respecterende browser doet dat goed. Ook IE als je 9 gebruikt.

    groetjes,

    ns_ripper
    don't argue with idiots, they only drag you down to their level and beat you with experience
    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