1. 10-04-2009, 15:23 #1
    gast4610
    gast4610 is offline Particulier
    Berichten
    111
    Lid sinds
    17 Jaar

    -delete-

    - delete
    Laatst aangepast door gast4610 : 04-11-2009 om 13:32
  3. 10-04-2009, 15:25 #2
    Boris Meer
    Boris Meer is offline Particulier
    Berichten
    650
    Lid sinds
    16 Jaar

    Wat lukt er niet? Zo kunnen wij je beter helpen ;)
  4. 10-04-2009, 15:31 #3
    gast4610
    gast4610 is offline Particulier
    Berichten
    111
    Lid sinds
    17 Jaar

    PHP Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

    <    html xmlns="http://www.w3.org/1999/xhtml">

        <    head>
            <    meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <    meta name="generator" content="Adobe GoLive" />
            <    title>Unica foundation</title>
            <    link rel="stylesheet" type="text/css" href="style.css" />

            <    script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
    </    head>

        <    body bgcolor="#f2f6c8" leftmargin="0" marginheight="0" marginwidth="0" topmargin="0">
        <    div id="website">
            <    div id="laag1"><a href="#"><img src="images/helpmee.png" alt="help mee!" height="127" width="127" align="left" border="0" class="png" /></a></div>
            <    table border="0" cellspacing="0" cellpadding="0" align="left" bgcolor="white">
                <    tr>
                    <    td><img src="images/blank.gif" width="24" height="28" border="0" /></td>
                    <    td><img src="images/blank.gif" width="365" height="28" border="0" /></td>
                    <    td><img src="images/blank.gif" width="175" height="28" border="0" /></td>
                    <    td><img src="images/blank.gif" width="60" height="28" border="0" /></td>
                    <    td><img src="images/blank.gif" width="336" height="28" border="0" /></td>
                    <    td><img src="images/blank.gif" width="24" height="28" border="0" /></td>
                </    tr>
                <    tr>
                <    td>&nbsp;</td>
                <    td><img src="images/logofoundation.jpg" alt="logo foundation" width="365" height="102" align="top" /></td>
                <    td colspan="4" align="left" valign="top" >
                    <    ul id="nav" name="nav" style="margin:0px;padding: 0px;width:580px;">
                      <    li><a href="#">Home</a></li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15" border="0" /></li>
                      <    li><a href="#">Over&nbsp;de&nbsp;stichting</a></li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15" border="0" /></li>
                      <    li><a href="#">Projecten</a>
                          <    ul id="layer1">
                            <    li class="first"><div style="height:7px"></div></li>
                            <    li><a href="#">Overzicht projecten</a></li>
                            <    li class="last"><a href="#">Overzicht technieken</a></li>
                          </    ul>
                      </    li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15" border="0" /></li>
                      <    li><a href="#">Partners</a></li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15" border="0" /></li>
                      <    li><a href="#">Sponsoring</a></li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15" border="0" /></li>
                      <    li><a href="#">Publicaties</a></li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15" border="0" /></li>
                      <    li><a href="#">Nieuws</a></li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15" border="0" /></li>
                      <    li><a href="#">Contact</a></li>
                    </    ul></td>
              </    tr>
                <    tr>
                    <    td colspan="6" align="left" valign="top" height="300"><img src="images/plaat.jpg" alt="technische ondersteuning bij ontwikkelingsprojecten" width="984" height="266" align="top" /></td>
                </    tr>
                <    tr align="left" valign="top">
                    <    td>&nbsp;</td>

                    <    td colspan="2" align="left" valign="top">

                    <    p align="left"><span class="stijl3">Nullam commy nullaore consequat dipsustisi ero dolore do digna alis am, consequisit iusto con utem dolendreet.</span><span class="stijl2"><br />
                                    Ed et venit utpatem acilla facidunt ullaorem dolor sum ercipsum del eugiat delesse qua Ut adit lamet et nit am zzrit lut vullandit dolorem iure mincin henim quis nim volore feu faci tismodolum ip ent ipisis ad er.<br />
                            </    span></p>
                        <    p align="right"><a href="#" class="buttongroen"><span class="stijl3">Lees verder &gt;</span></a></p>
                        <    table border="0" cellspacing="0" cellpadding="0">
                          <    tr>
                            <    td height="28" align="left" valign="bottom"><div align="center"><span class="stijl3">Actuele projecten:</span></div></td>
                          </    tr>
                          <    tr>
                            <    td height="20">&nbsp;</td>
                          </    tr>
                          <    tr>
                            <    td width="98" height="65"><script type="text/javascript">
    AC_FL_RunContent( 'codebase','http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0','name','projectencaroussel','width','536','height','85','align','middle','id','projectencaroussel','src','projectencaroussel','quality','high','bgcolor','#ffffff','allowscriptaccess','sameDomain','pluginspage','http://www.macromedia.com/go/getflashplayer','movie','projectencaroussel' ); //end AC code
                                    </script>
                                <    noscript>
                                <    object classid="clsid:d27cdb6e-ae6d-11cf-96b8-444553540000" codebase="http://fpdownload.macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=8,0,0,0" name="projectencaroussel" width="536" height="85" align="middle" id="projectencaroussel">
                                  <    param name="allowScriptAccess" value="sameDomain" />
                                  <    param name="movie" value="projectencaroussel.swf" />
                                  <    param name="quality" value="high" />
                                  <    param name="bgcolor" value="#ffffff" />
                                  <    embed src="projectencaroussel.swf" quality="high" bgcolor="#ffffff" width="536" height="85" name="projectencaroussel" align="middle" allowscriptaccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /></embed>
                                  </    embed>
                                </    object>
                                </    noscript>
                            </    td>
                          </    tr>
                        </    table></td>
                    <    td>&nbsp;</td>
                    <    td>

                        <    p><span class="stijl3">+ + + N I E U W S + + +<br />
                                <    br />
                            </    span><span class="stijl2">19-05-2008</span><br />
                            <    span class="stijl3">Lorum ipsilum perla son</span><br />
                            <    span class="stijl2">Gue consed tatem zzrillutatu dolor am etuercinit, susto dionsecte mo luptat. Duis ex et, se magnissi tem vullaorem il illan ulla faccum il exer aliquam</span></p>
                        <    p align="right"><a href="#" class="buttongroen">Lees verder &gt;</a></p>
                        <    p align="left"><span class="stijl2">19-05-2008</span><br />
                            <    span class="stijl3">Lorum ipsilum perla son</span><br />
                            <    span class="stijl2">Gue consed tatem zzrillutatu dolor am etuercinit, susto dionsecte mo luptat. Duis ex et, se magnissi tem vullaorem il illan ulla faccum il exer aliquam</span></p>
                        <    p align="right"><a href="#" class="buttongroen">Lees verder &gt;</a></p>
                        <    p align="left"><span class="stijl2">19-05-2008</span><br />
                            <    span class="stijl3">Lorum ipsilum perla son</span><br />
                            <    span class="stijl2">Gue consed tatem zzrillutatu dolor am etuercinit, susto dionsecte mo luptat. Duis ex et, se magnissi tem vullaorem il illan ulla faccum il exer aliquam</span></p>
                        <    p align="right"><a href="#" class="buttongroen">Lees verder &gt;<br />
                            </    a><br />
                            <    br />
                            <    a href="#" class="tabellink">Overige berichten</a></p>

                    </    td>
                    <    td>&nbsp;</td>
                </    tr>
                <    tr height="70">
                    <    td colspan="6"height="70"></td>
                </    tr>
            </    table>
            </    div>
        </    body>

    </    html> 
    Deze code hierboven moet in divs ipv tables en onnodige html codes..

    ik ben tot hier gekomen..

    PHP Code:
    <!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" xml:lang="en" lang="en">
        <    head>
            <    meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
            <    meta name="generator" content="Adobe GoLive" />
            <    title>Unica foundation</title>
            <    link rel="stylesheet" type="text/css" href="style.css" />

            <    script src="Scripts/AC_RunActiveContent.js" type="text/javascript"></script>
    </    head>
    <    body>
        <    div id="wrapper">
            <    div id="content">

            <    img src="images/logofoundation.jpg" alt="logo foundation" width="365" height="102" />
                  <    ul id="nav">
                      <    li><a href="#">Home</a></li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15"  /></li>
                      <    li><a href="#">Over de stichting</a></li>
                      <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15"  /></li>
                      <    li><a href="#">Projecten</a>
                  <    ul id="layer1">
                    <    li class="first">
                      <    div style="height: 7px;"></div>
                    </    li>
                    <    li><a href="#">Overzicht projecten</a></li>
                    <    li class="last"><a href="#">Overzicht technieken</a></li>
                  </    ul>
              </    li>
                  <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15"  /></li>
                  <    li><a href="#">Partners</a></li>
                  <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15"  /></li>
                  <    li><a href="#">Sponsoring</a></li>
                  <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15"  /></li>
                  <    li><a href="#">Publicaties</a></li>
                  <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15"  /></li>
                  <    li><a href="#">Nieuws</a></li>
                  <    li><img src="images/schknoppen.jpg" alt="streepje" width="18" height="15"  /></li>
                  <    li><a href="#">Contact</a></li>
                </    ul>     
                <    div id="plaat"><img src="images/plaat.jpg" alt="technische ondersteuning bij ontwikkelingsprojecten" width="984" height="266" align="top" /></div>
                <    div id="laag1"><a href="#"><img src="images/helpmee.png" alt="help mee!" height="127" width="127" align="left" border="0" class="png" /></a></div>
              </    div>
           </    div>
    </    body></html> 
    en vanaf nu weet ik het niet meer..

    CSS:
    PHP Code:
    #wrapper {
            margin:-20px auto;
            width:984px;
            height:auto;
    }
    body {
            background-color:#f2f6c8;
    }

    #content {
            background-color:#FFFFFF;
            padding:24px;
    }


    #bg-soft {
            margin:0px 593px;
    }

    #laag1{
            margin-left:800px;
            margin-top:-50px;
            z-index:4;
    }
    #plaat{
            margin-left:-24px;
            z-index:5;
    }



    #droplines { position: relative;}
    #dropline1 {position:absolute; left: 58px; font-size:12px; height:45px; }
    #dropline1 ul { margin: 0px; padding: 0px;}
    #dropline1 li {float:left; height:45px;list-style:none;}
    #dropline1 li a { display:block; width: 265px;height: 45px;}
    #dropline1 li ul {list-style:none; position:relative; top: -25px;  }
    #dropline1 li ul li a { display:inline; color: #0b6e19; }
    #dropline1 li:hover ul li div { display:block;}

    #dropline1 {position:absolute; left: 58px; font-size:12px; height:45px; }
    #dropline1 ul { margin: 0px; padding: 0px;}
    #dropline1 li {float:left; height:45px;list-style:none;}
    #dropline1 li a { display:block; width: 765px;height: 45px;}
    #dropline1 li ul {list-style:none; position:relative; top: 0px;  }
    #dropline1 li ul li a { display:inline; color: #0b6e19; }
    #dropline1 li:hover ul li div { display:block;}


    #dropline2 {position:absolute; left: 369px; font-size:12px; height:45px; }
    #dropline2 ul { margin: 0px; padding: 0px;}
    #dropline2 li {float:left; height:45px;list-style:none;}
    #dropline2 li a { display:block; width: 265px;height: 45px; }
    #dropline2 li ul {list-style:none;position:relative; top: -25px;  }
    #dropline2 li ul li a { display:inline; color: #0b6e19; }
    #dropline2 li:hover ul li div { display:block;}

    #dropline3 {position:absolute; left: 670px;font-size:12px; height:45px;}
    #dropline3 ul { margin: 0px; padding: 0px;}
    #dropline3 li {float:left; height:45px;list-style:none;}
    #dropline3 li a { display:block; width: 355px; height: 45px;}
    #dropline3 li ul {list-style:none; position:relative; top: -25px; left:-50px;}
    #dropline3 li ul li a { display:inline; color: #0b6e19; }
    #dropline3 li:hover ul li div { display:block;}



    .button img{ position: relative; z-index:100; left: 50px;top: 8px;}
    .    noline { text-decoration: none; color:#0F0;}

    .pag { background-color: #E3DB49; color:#0b6e19; text-decoration: none; width: 10px; font-family:Verdana, Arial; font-size: 10px; font-weight:bold; text-align:center; }
    .on, .pag:hover { background-color: #E3DB49; color:#FFF; text-decoration: none; font-weight:bold; }
    #nav { position: absolute; margin-top:-54px; margin-left:350px;}
    #nav ul { list-style:none; float:left; }
    #nav li {float:left; list-style:none; margin:0px;}
    #nav li li {float:none; border-left:2px solid #E3DB49; background-color:#FFF; border-right:2px solid #E3DB49;}
    #nav li.first {border-width: 0px; border-bottom:2px solid #E3DB49; background-image: url('images/top_submenu.gif');}
    #nav li.last {border-bottom:2px solid #E3DB49;}
    /* a hack for  IE6 */
    * html #nav li li {float:left;}
    #nav li a {display:block; float:left; font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 10px; color:#0b6e19; height:20px;  text-decoration:none; white-space:nowrap; font-weight:bold;}

        


    #nav li li a {display:block; height:20px; line-height:20px; float:none; padding:0px 20px 0px 5px; font-weight:bold; }
    #nav li:hover {position:relative; z-index:300;}
    #nav li.cssplay_hover {position:relative; z-index:300;}
    #nav li.cssplay_hover a {color:#633;}

    #nav li li a {color:#0b6e19;}
    #nav li li.cssplay_hover a {color:#fff; background-color:#aaa;}

    #nav li:hover ul {left:-40px; top:15px; z-index:500; }
    #nav li.cssplay_hover ul {left:0; top:15px; z-index:500;}

    #nav ul {position:absolute; left:-9999px; top:-9999px;}
    * html #nav ul {width:2px;}
    /* it could have been this simple if all browsers understood */
    /* show next level */
    #nav li:hover li:hover > ul {left:-5px; margin-left:100%; top:-1px; z-index:500;}
    /* keep further levels hidden */
    #nav li:hover > ul ul {position:absolute; left:-9999px; top:-9999px; width:auto; }
    /* show path followed */
    #nav li li:hover > a {color:#AAC399; background-color:#FFF;}

    /* but IE5.x and IE6 need this lot to style the flyouts*/
    #nav li.cssplay_hover li.cssplay_hover a,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover a,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover a
    {color:#fff; background-color:#fff;}

    #nav li.cssplay_hover li.cssplay_hover li a,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li a,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li a,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li a,
    {color:#633; background-color:#ddd;}

    /* show next level */
    #nav li.cssplay_hover li.cssplay_hover ul,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover ul,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul
    {left:100%; margin-left:-5px; top:-1px; }

    /* keep further levels hidden */
    #nav li.cssplay_hover ul ul,
    #nav li.cssplay_hover li.cssplay_hover ul ul,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover ul ul,
    #nav li.cssplay_hover li.cssplay_hover li.cssplay_hover li.cssplay_hover ul ul
    {position:absolute; left:-9999px; top:-9999px;} 
  5. 10-04-2009, 15:39 #4
    Boris Meer
    Boris Meer is offline Particulier
    Berichten
    650
    Lid sinds
    16 Jaar

    En wat snap je dan niet meer? Want heb je dit zelf geschreven of wat lukt er niet?
  6. 10-04-2009, 15:46 #5
    gast4610
    gast4610 is offline Particulier
    Berichten
    111
    Lid sinds
    17 Jaar

    Ik upload het wel even...

    Zo moet het eruit komen te zien: http://justatune.net/unica/tables/

    En ik heb hem tot nu toe zo: http://justatune.net/unica/div/

    De knop wordt overlapt door het grote plaatje...

    en in IE komt die er anders uit te zien dan in FF...
  7. 10-04-2009, 16:02 #6
    Gijs Bloemen
    Gijs Bloemen is offline Gijs Bloemen
    Berichten
    1.531
    Lid sinds
    17 Jaar

    Eeumh...

    Code:
    <div id="plaat"><img src="images/plaat.jpg" alt="technische ondersteuning bij ontwikkelingsprojecten" width="984" height="266" align="top" /></div>          <div id="laag1"><a href="#"><img src="images/helpmee.png" alt="help mee!" height="127" width="127" align="left" border="0" class="png" /></a>


    Die plaat moet je hier als BG gebruiken en de afbeelding kun je als BG gebruiken maar dat moet niet.

    Dus dan wordt je CSS (al de rest blijft hetzelfde he):

    Code:
    

    
	
    Code:
    
	
    #laag1{
    margin-left:800px;
    margin-top:-50px;
    z-index:4;

}
#plaat{
    margin-left:-24px;
    z-index:5;
    width: 984px;
      height: 266px;
      background: url(images/plaat.jpg);
}
    


    

    
De xHTML wordt: 
    

    

    
	
    Code:
    
	
    <div id="plaat">            <div id="laag1"><a href="#"><img src="images/helpmee.png" alt="help mee!" height="127" width="127" align="left" border="0" class="png" /></a>
</div>
    


    

    
De kans is wel reeel dat je nog wat met de margin's moet spelen om het perfect goed gepositioneerd te krijgen maar dat lukt je wel niet? En anders vraag je het maar weer.
    

    

    
    
				
    
			
    

			


		
    
			
				
			
			
			
		
    
	
    
	
    
		
    
			
				
				
				
				
				

			
			
				
					
				
				

				 
				

					

					
					 

					
					
					
					
					
			
		
    
	
    
	
    

    8. 


  8. 
	
    
		
    
                        
                                
                                        
                                                10-04-2009, 16:14
                                        
                                
                                
                                        
                                                #7
                                        
                                        
                                        
                                
                        
		
    

		
    
			
    
				
				
    
					
						
    
	gast4610
	

    
						gast4610 is offline

					
					
						Particulier
					
					

                                        
					

				
    
			
    
			
				
    
					
    
						
						
						
						
    Berichten
     
    111
    	
						




    Lid sinds
    

    17 Jaar
    




					
    
					
					
				
    
			
		
    
	
    

	
    
		
		
    
		
		
    
			
		
    
		
				
				
		
    
			
    
				
    
					maar als ik nou switch naar IE dan is mijn hele menu weg.. ook lukt het mij niet om de button met margin naar beneden te krijgen, als ik dat doe dan gaat de hele header mee omdat die button in de div van het plaatje zit...
				
    
			
    

			


		
    
			
				
			
			
			
		
    
	
    
	
    
		
    
			
				
				
				
				
				

			
			
				
					
				
				

				 
				

					

					
					 

					
					
					
					
					
			
		
    
	
    
	
    

    9. 


  9. 
	
    
		
    
                        
                                
                                        
                                                10-04-2009, 16:20
                                        
                                
                                
                                        
                                                #8
                                        
                                        
                                        
                                
                        
		
    

		
    
			
    
				
				
    
					
						
    
	Gijs Bloemen
	

    
						Gijs Bloemen is offline

					
					
						Gijs Bloemen
					
					

                                        
					

				
    
			
    
			
				
    
					
    
						
						
						
						
    Berichten
     
    1.531
    	
						




    Lid sinds
    

    17 Jaar
    




					
    
					
					
				
    
			
		
    
	
    

	
    
		
		
    
		
		
    
			
		
    
		
				
				
		
    
			
    
				
    
					Laat nog eens de huidige online versie zien. Ik denk dat ik begrijp wat je bedoelt maar iets zien is altijd ff duidelijker.
				
    
			
    

			


		
    
			
				
			
			
			
		
    
	
    
	
    
		
    
			
				
				
				
				
				

			
			
				
					
				
				

				 
				

					

					
					 

					
					
					
					
					
			
		
    
	
    
	
    

    10. 


  10. 
	
    
		
    
                        
                                
                                        
                                                13-04-2009, 12:49
                                        
                                
                                
                                        
                                                #9
                                        
                                        
                                        
                                
                        
		
    

		
    
			
    
				
				
    
					
						
    
	gast4610
	

    
						gast4610 is offline

					
					
						Particulier
					
					

                                        
					

				
    
			
    
			
				
    
					
    
						
						
						
						
    Berichten
     
    111
    	
						




    Lid sinds
    

    17 Jaar
    




					
    
					
					
				
    
			
		
    
	
    

	
    
		
		
    
		
		
    
			
		
    
		
				
				
					
				
		
    
			
    
				
    
					Is het nog gelukt Gijs ?
				
    
			
    

			


		
    
			
				
			
			
			
		
    
	
    
	
    
		
    
			
				
				
				
				
				

			
			
				
					
				
				

				 
				

					

					
					 

					
					
					
					
					
			
		
    
	
    
	
    

    11. 

		

		

		

			
		


	
























	

	
		
	













	
	
	
	
	
	
	
Tags voor dit bericht

	
	
	

		

	














 



 

 

 



	

		


		

			
Quick links

			

				

					
				

			
			
		



		

			
Sitedeals

			

				

					
				

			
			
		


		

			
Andere media

			
		

   
        

			
Over Sitedeals

			

				
    
					
  • Sitedeals.nl is de grootste handelswebsite voor website eigenaren. Deel kennis en participeer op het webmasterforum.
				
    • 
				
				

			

		

		

	








	

		
Inloggen

		
		
		

			
			
			
			
			
			
			
			
			
			
			
			
			
			Inloggen