Problemen met website in IE

Status
Niet open voor verdere reacties.

rickcure

Gebruiker
Lid geworden
8 jul 2009
Berichten
7
Mijn website wordt niet goed weergeven in internet explorer. In safari, firefox en opera werkt alles naar behoren. Ik heb gelezen dat het een veel voorkomend probleem is. Ik kan echter niet vinden hoe ik dit specifieke geval kan oplossen. Ik heb het idee dat het aan de float ligt. Overal waar ik een float heb ingesteld dus bij de navigatiebalk, header en footer komen deze niet naast elkaar te staan maar onder elkaar. Klopt het dat het aan de floats ligt?

Kan iemand mij helpen dit probleem op te lossen.

Dankjewel.
 

Bijlagen

  • IE.jpg
    IE.jpg
    44,5 KB · Weergaven: 52
Laatst bewerkt:
Hoi Rick,
Hé! (1)
Ik dacht dat ik hier gisteren op gereageerd had, maar kennelijk net een crash gehad bij openstaand bericht, en naderhand niet meer gecheckd. :(

Had even de site bekeken: het zit niet in de eerste plaats in de floats, maar in de dubbele div-verpakking van de linker- en rechterhelft. In de buitenste div-schilllen heb je 50% breedte staan, in de binnenschil heb je (verschillende) breedtes in pixels opgegeven. Dat kan niet goed gaan! ;)
Ook Firefox was niet 100% (bij alle resoluties): bij 1024x768px is er bv. een strookje aan de linkerkant foetsie.
Verder lopen de vast-formaat achtergrond-plaatjes niet lekker bij een wisselende lettergrootte.
De html-validator en de css-validator kunnen goede diensten bewijzen!

Hé! (2)
Bij nu nog eens kijken zie ik een heel andere basislayout...
Is je vraag daarmee vervallen?

CSShunter
 
Nee ik heb de lay-out niet veranderd maar wil er uiteindelijk een wordpress theme van maken, dus was even aan het kijken hoe wordpress werkt door een standaard theme te plaatsen.

Je hebt het over de dubbele div's met de buitenste 50% en de binnenste vaste pixels. Raad je me aan om van deze pixels ook procenten te maken dan?

Door een validator de code te laten checken kom ik niet veel verder omdat deze geen noemenswaardige fouten opgeeft.

Dit is de code zoals hij op dit moment is:

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"><!-- InstanceBegin template="/Templates/perlex.dwt" codeOutsideHTMLIsLocked="false" -->
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<!-- InstanceBeginEditable name="doctitle" -->
<title></title>
<!-- InstanceEndEditable -->
<link href="style.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
<!--
function MM_preloadImages() { //v3.0
  var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
}

function MM_findObj(n, d) { //v4.01
  var p,i,x;  if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
  if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
  for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
  if(!x && d.getElementById) x=d.getElementById(n); return x;
}

function MM_nbGroup(event, grpName) { //v6.0
  var i,img,nbArr,args=MM_nbGroup.arguments;
  if (event == "init" && args.length > 2) {
    if ((img = MM_findObj(args[2])) != null && !img.MM_init) {
      img.MM_init = true; img.MM_up = args[3]; img.MM_dn = img.src;
      if ((nbArr = document[grpName]) == null) nbArr = document[grpName] = new Array();
      nbArr[nbArr.length] = img;
      for (i=4; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
        if (!img.MM_up) img.MM_up = img.src;
        img.src = img.MM_dn = args[i+1];
        nbArr[nbArr.length] = img;
    } }
  } else if (event == "over") {
    document.MM_nbOver = nbArr = new Array();
    for (i=1; i < args.length-1; i+=3) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = (img.MM_dn && args[i+2]) ? args[i+2] : ((args[i+1])? args[i+1] : img.MM_up);
      nbArr[nbArr.length] = img;
    }
  } else if (event == "out" ) {
    for (i=0; i < document.MM_nbOver.length; i++) {
      img = document.MM_nbOver[i]; img.src = (img.MM_dn) ? img.MM_dn : img.MM_up; }
  } else if (event == "down") {
    nbArr = document[grpName];
    if (nbArr)
      for (i=0; i < nbArr.length; i++) { img=nbArr[i]; img.src = img.MM_up; img.MM_dn = 0; }
    document[grpName] = nbArr = new Array();
    for (i=2; i < args.length-1; i+=2) if ((img = MM_findObj(args[i])) != null) {
      if (!img.MM_up) img.MM_up = img.src;
      img.src = img.MM_dn = (args[i+1])? args[i+1] : img.MM_up;
      nbArr[nbArr.length] = img;
  } }
}
//-->
</script>
<!-- InstanceBeginEditable name="head" -->
<!-- InstanceEndEditable -->
</head>

<body onload="MM_preloadImages('images/home.jpg','images/product.jpg','images/verkoop.jpg','images/media.jpg','images/contact.jpg')">
<div id="body">
  <div id="top">
    <div id="container1">
      <div id="logo">
      <a href="index.html"><img src="images/layoutopnieuwgesliced_01.jpg" width="508" height="166" /></a></div>
    </div>
  </div>
   
   
  <div id="navigationleft">
    <div id="navigationleft2"></div>
  </div>
  <div id="navigationright">
    <div id="navigationright2"></div>
    <div id="menu">
    <a href="index.html" target="_top" onclick="MM_nbGroup('down','group1','homebutton','images/home.jpg',1)" onmouseover="MM_nbGroup('over','homebutton','images/home.jpg','',1)" onmouseout="MM_nbGroup('out')"><img src="images/homebutton.jpg" alt="home" name="homebutton" border="0" id="homebutton" onload="" /></a><img src="images/layoutopnieuwgesliced_08.jpg" width="7" height="30" /><a href="product.html" target="_top" onclick="MM_nbGroup('down','group1','productbutton','images/product.jpg',1)" onmouseover="MM_nbGroup('over','productbutton','images/product.jpg','',1)" onmouseout="MM_nbGroup('out')"><img src="images/productbutton.jpg" alt="product" name="productbutton" border="0" id="productbutton" onload="" /></a><img src="images/layoutopnieuwgesliced_10.jpg" width="7" height="30" /><a href="verkoop.html" target="_top" onclick="MM_nbGroup('down','group1','verkoopbutton','images/verkoop.jpg',1)" onmouseover="MM_nbGroup('over','verkoopbutton','images/verkoop.jpg','',1)" onmouseout="MM_nbGroup('out')"><img src="images/verkoopbutton.jpg" alt="verkoop" name="verkoopbutton" border="0" id="verkoopbutton" onload="" /></a><img src="images/layoutopnieuwgesliced_12.jpg" width="7" height="30" /><a href="media.html" target="_top" onclick="MM_nbGroup('down','group1','mediabutton','images/media.jpg',1)" onmouseover="MM_nbGroup('over','mediabutton','images/media.jpg','',1)" onmouseout="MM_nbGroup('out')"><img src="images/mediabutton.jpg" alt="media" name="mediabutton" border="0" id="mediabutton" onload="" /></a><img src="images/layoutopnieuwgesliced_14.jpg" width="7" height="30" /><a href="contact.html" target="_top" onclick="MM_nbGroup('down','group1','contactbutton','images/contact.jpg',1)" onmouseover="MM_nbGroup('over','contactbutton','images/contact.jpg','',1)" onmouseout="MM_nbGroup('out')"><img src="images/contactbutton.jpg" alt="contact" name="contactbutton" border="0" id="contactbutton" onload="" /></a></div>
  </div>
  <div id="greenleft">
    <div id="greenleft2">
      <div id="greentext"><h2><b>test</b></h2>
  test
<br />
<br />
<p align="right"><a href="#"><b>Lees verder...</b></a></p></div>
    </div>
  </div>
  <div id="greenright">
    <div id="greenright2"></div>
  </div>
  
  <div id="content">
    <div id="container2"><!-- InstanceBeginEditable name="content" -->
      <div id="contenttext">
        <div id="text">
          <div class="post">Dit is een testpost.</div>
          <div class="info">Auteur: Freek Ton / Categorie: Nieuws / Datum: 01-09-09</div>
          <div class="picture"><img src="images/postpicture.jpg" width="125" height="125" /></div>
          <div class="message">Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.</div>
          <div class="leesverder"><a href="#">Lees verder...</a></div>
          <div class="divider">
            <hr width="80%" align="center" color="#464646" size="1px" border="0px" />
          </div>
        </div>
      </div>
    <!-- InstanceEndEditable -->
      <!-- InstanceBeginEditable name="sidebar" --><div id="sidebar">Contentsidebar for  id &quot;sidebar&quot; Goes Here</div><!-- InstanceEndEditable -->
    </div>
  </div>
  
  
  <div id="footer">    <div id="leftfooter">
      <div id="leftfooter2">
        <div id="menu2"><a href="index.html">home</a> &nbsp;   |&nbsp;
      <a href="product.html">product</a> &nbsp;|&nbsp;
      <a href="verkoop.html">verkoop</a> &nbsp;|&nbsp;
      <a href="media.html">media</a> &nbsp;|&nbsp;
      <a href="contact.html">contact</a> 
</div>
      </div></div>
    <div id="rightfooter">
      <div id="rightfooter2"></div>
    </div>
  <div id="bottom">
    <div id="copyright"><p>&nbsp;</p><p>PerLex ©2009  -  Alle rechten voorbehouden</p></div>
  </div></div>
</div>
</body>
<!-- InstanceEnd --></html>
 
Aha!
Nu heb ik geen kennis van Wordpress, maar als je een eigen template voor Wordpress wilt maken (niet: de vormgeving van een bestaand Wordpress-thema aanpassen), moet je je dan niet eerst verdiepen in de eisen die Wordpress aan zo'n eigengemaakt template stelt? - Er zullen toch een aantal "aangrijpingspunten" voor Wordpress in moeten zitten (<div>'s met een bepaalde namen enzo), waardoor Wordpress als ContentManagementSystem met het template/thema kan werken?
  • Misschien kan je in dat geval je vraag beter stellen in de rubriek CMS.
En als je aangepaste styles voor een bestaand Wordpress-thema wilt gaan gebruiken, moet je dan niet beginnen met de html-opbouw van een pagina in dat Wordpress-thema?

Ander punt: de code zoals je die hier hebt neergezet, als we deze losschroeven van opnemen in Wordpress (dus: als zelfstandige pagina-layout met zelfstandige html-onderdelen bekijken). Hier kan eigenlijk niets zinnigs over gezegd worden als er niet de style.css en de plaatjes bij zitten. Nu is er alleen dit te zien, en dat is wat mager om tips over te kunnen geven. ;)
Kan je de testpagina compleet met alles erop en eraan uploaden, en hier een link zetten?

Maar misschien is het nog belangrijker om eerst te bepalen hoe het in Wordpress moet gaan draaien. Dan moet er misschien een ander type pagina gemaakt worden.

Met vriendelijke groet,
CSShunter
 
Status
Niet open voor verdere reacties.
Terug
Bovenaan Onderaan