Chrome/IEX weergave problemen + zoekmachine werkt niet

AndreazZz · 21 jan 2012

blok op afstand van element met variabele hoogte

Hallo,
Voor school moet ik een website maken en ik heb het volgende probleem:
Hoe maak ik een element dat op vaste afstand onder mijn hoofd staat? Daarbij zeggende dat het hoofd een variabele hoogte heeft gekregen, doordat ik die niet heb ingesteld in mijn CSS.

Ik heb nu dit:

HTML:

#hoofd
{
width:800px;
height:auto;
border:2px solid darkblue;
background-color: 4f8ca7;
color: black;
position:absolute;
top:200;
left:170;
color:black;
z-index:5;
}

#copyright
{
width:960px;
height:50px;
border:1px solid red;
color: gray;
position: relative;
top:0200px;
left:89px;
z-index:10;
}

edit: die positie in het Copyright element klopt dus NIET. En die leraar zat wat te klooien met die z-index, maar ik snap niet waarom. Ik denk dat 'ie m'n vraag niet snapte.

csshunter · 22 jan 2012

Hoi AndreazZz,
Waarschijnlijk staat je #copyright-container in een <div> na de <div id="hoofd">.
Maar als je het #hoofd een absolute positie geeft, komt dat los te staan van de rest van de pagina-elementen, en kan je er geen element onder zetten op een afstand die mee varieert met de hoogte van het #hoofd.
Met een z-index heeft dit niets te maken, dat klopt (daarmee kan je elementen elkaar laten overlappen, maar dat is hier juist niet van toepassing; de z-indexen kunnen er gewoon uit).

Als je de absolute positie uit het #hoofd haalt, komt de #copyright er altijd onder te staan, op een afstand die je kunt regelen met de {margin-top: ...px} van de #copyright-container.

Wat eventueel ook zou kunnen: de <div id="copyright"> als laatste element binnen het #hoofd zetten: dan gaat ie mee met wat erboven aan (variabele) hoogte staat.
Maar met de absolute positie krijg je dan het verschijnsel dat de rest van de pagina er onder nooit goed kan komen.

Absolute posities zijn erg gevaarlijk!

Met vriendelijke groet,
CSShunter

AndreazZz · 22 jan 2012

Zeer veel dank!! Ik heb de positie van het hoofd veranderd in relative, en in een keer werkte het! Nogmaals zeer veel dank!

AndreazZz · 22 jan 2012

Ik bekijk m'n site nu in Internet Explorer 7 (anders in Chrome), maar daar verschijnt in een keer, bovenop de normale achtergrond, een rood vlak, wat een deel van de achtergrond bedekt. Ik heb werkelijk geen idee waar dit vandaan komt, want als ik ga zoeken naar "red", "ee"(voor #ee0000), dan vindt hij niets! Daarentegen werkt het filmpje met quicktimeplayer wel in IE en niet in Chrome. Zou je me nog een keer kunnen helpen?
Alvast bedankt!!

edit: de code:

HTML:

<TD><a href="../MVS/casemod ferrari.avi">
<img dynsrc="../MVS/casemod ferrari.avi" start="fileopen" width="200" height="200" />
</a> </TD>

In internet explorer doet dat Copyright element het ook niet

csshunter · 22 jan 2012

Hoi AndreazZz,
De eigenschap dynsrc="..." is een eigenschap die door Microsoft bedacht is (zie hier), en werkt in Internet Explorer.
Er staat ook bij: "There is no public standard that applies to this property. ", oftewel: deze eigenschap is geen standaard html-code.
Dat klopt, want in de eigenschappen-lijst van de html-specifcatie komt deze eigenschap niet voor: en andere browsers dan IE reageren er niet op.

Voor hoe het wel moet: zoek op How embed avi.

=====

In internet explorer doet dat Copyright element het ook niet

Ik ben bang dat we er zonder link naar de patiënt-pagina niet achter kunnen komen waarom niet.

Met vriendelijke groet,
CSShunter

AndreazZz · 22 jan 2012

Hallo,
Ik ben voor school een website aan het maken en loop tegen een paar dingen aan. Ik ben namelijk gewend in Chrome te werken en een paar dingen werken in Chrome wel die het in Internet Explorer niet doen en omgekeerd. Dit is wel een beetje vervelend, aangezien m'n leraar (volgens mij) zo'n persoon is die Internet Explorer blijft gebruiken.
Ik heb de volgende problemen:
Ik heb een filmpje dat in Internet Explorer wél doet, en in Chrome niet. edit: in IEX doet 'ie het nu ook niet meer.

HTML:

<TD><a href="../MVS/casemod ferrari.avi">
<img dynsrc="../MVS/casemod ferrari.avi" start="fileopen" width="200" height="200" />
</a> </TD>

In internet explorer wordt daarentegen een element niet weergegeven.

HTML:

#hoofd
{
width:800px;
height:auto;
border:2px solid darkblue;
background-color: 4f8ca7;
color: black;
position:relative;
top:200;
left:170;
color:black;
}
 
#copyright
{
width:960px;
height:50px;
border:1px solid red;
color: gray;
position: relative;
top:0200px;
left:89px;
}

En tot slot: ik heb van google een custom search engine gemaakt, maar die werkt niet (of moet je daar eerst nog andere dingen voor doen?)
De code zal ik op aanvraag uploaden (enorme lap)

Ik heb al een hele boel geprobeerd, maar het wil niet werken.

Alvast bedankt voor jullie reacties!

AndreazZz · 22 jan 2012

hier kan je de online versie vinden van mijn site, hij is alleen een klein beetje outdated. Het probleem doet zich op elke pagina voor.

That Guy · 22 jan 2012

dynsrc

dynsrc
dynsrc
dynsrc

... pam pam paaaaaaaam

Dat is nou eens een property die ik lang lang geleden voor het laatst ben tegengekomen. dynsrc is geen onderdeel van het gestandaardiseerde HTML, en werkt alleen in IE. Andere browsers kennen het niet en doen er dan ook niets mee. Oh, en een website bouwen voor maar een enkele browser is echt een Slecht Idee™.

Als je een filmpje wilt laten zien kan dat via de (HTML 5) <video>, een <object> en/of <embed> of zo'n flash geval.

Voor je search vraag zul je code moeten geven (of beter, een online pagina) want met alleen 'het werkt niet' kunnen we niets.

csshunter · 22 jan 2012

Hoi AndreazZz,
Al eens de html-validator geraadpleegd? Regelmatig doen! Zie!
Er zitten o.a. 2 <body>'s in: één in de <head> (!), en één eronder.

Dat kan nooit goed gaan: één hoofd met twee lijven, waarbij er ook nog een lijf in het hoofd zit.

Ik zou dat eerst eens oplossen, en dan kijken of het probleem zich nog voordoet.

Met vriendelijke groet,
CSShunter

AndreazZz · 22 jan 2012

Erg bedankt voor je reactie, ik zal morgen de code uploaden voor de zoekmachine. En over dat dynsrc : dat had iemand anders ook al opgemerkt, ik zal er morgen naar kijken: moet er morgenochtend weer vroeg uit

.

AndreazZz · 22 jan 2012

Hoe moet ik dat dan aanpassen? moet ik <body background .........> uit de head halen? Of moet ik de <body> onder de </head> vandaan halen?
Ik dank voor de deskundigheid.:thumb:
Moet je per se een List Item afsluiten naar </li>? Ik merk namelijk geen verschil met wanneer ik dat wel doe?
En align, wat is daar het probleem mee?

csshunter · 22 jan 2012

Hm hé, behalve de zoekmachine-vraag lijkt deze vraag verdacht veel op die in dit topic, waar ik om 18:20 (dus vóór deze vraag) al hetzelfde antwoord over de dynsrc gaf als That Guy (zij het zonder Slecht Idee™), en óók om een online pagina vroeg voor de rest.

En daar heb ik zonet ook een antwoord gepost over de niet-verschijnende #copyright-regel in IE.

Zie aldaar!

<edit>
Dit was dus een kruispost met de vorige. Die iemand anders was ik.

</edit>

AndreazZz · 23 jan 2012

Sorry

, ik had de vraag geloof ik als opgelost gemeld en daarna weer teruggezet, maar toen dacht ik: dat moet eigenlijk in een ander topic. Dus...

Even snel de code gekopieerd:

HTML:

<div id="cse" style="width: 100%;">Loading</div>
<script src="http://www.google.com/jsapi" type="text/javascript"></script>
<script type="text/javascript"> 
  google.load('search', '1', {language : 'nl'});
  google.setOnLoadCallback(function() {
    var customSearchOptions = {};
    var customSearchControl = new google.search.CustomSearchControl(
      '017220339565957154179:n7jswj_egd0', customSearchOptions);
    customSearchControl.setResultSetSize(google.search.Search.FILTERED_CSE_RESULTSET);
    customSearchControl.draw('cse');
  }, true);
</script>
<link rel="stylesheet" href="http://www.google.com/cse/style/look/default.css" type="text/css" /> <style type="text/css">
  .gsc-control-cse {
    font-family: Arial, sans-serif;
    border-color: #0000a0;
    background-color: #4f8ca7;
  }
  input.gsc-input {
    border-color: #4f8ca7;
  }
  input.gsc-search-button {
    border-color: #cccccc;
    background-color: #000099;
  }
  .gsc-tabHeader.gsc-tabhInactive {
    border-color: #0170fb;
    background-color: #0000ff;
  }
  .gsc-tabHeader.gsc-tabhActive {
    border-top-color: #0000df;
    border-left-color: #0170fb;
    border-right-color: #0170fb;
    background-color: #00cccc;
  }
  .gsc-tabsArea {
    border-color: #0170fb;
  }
  .gsc-webResult.gsc-result,
  .gsc-results .gsc-imageResult {
    border-color: #FFFFFF;
    background-color: #FFFFFF;
  }
  .gsc-webResult.gsc-result:hover,
  .gsc-webResult.gsc-result.gsc-promotion:hover,
  .gsc-imageResult:hover {
    border-color: #FFFFFF;
    background-color: #FFFFFF;
  }
  .gs-webResult.gs-result a.gs-title:link,
  .gs-webResult.gs-result a.gs-title:link b,
  .gs-imageResult a.gs-title:link,
  .gs-imageResult a.gs-title:link b {
    color: #0000CC;
  }
  .gs-webResult.gs-result a.gs-title:visited,
  .gs-webResult.gs-result a.gs-title:visited b,
  .gs-imageResult a.gs-title:visited,
  .gs-imageResult a.gs-title:visited b {
    color: #0000CC;
  }
  .gs-webResult.gs-result a.gs-title:hover,
  .gs-webResult.gs-result a.gs-title:hover b,
  .gs-imageResult a.gs-title:hover,
  .gs-imageResult a.gs-title:hover b {
    color: #0000CC;
  }
  .gs-webResult.gs-result a.gs-title:active,
  .gs-webResult.gs-result a.gs-title:active b,
  .gs-imageResult a.gs-title:active,
  .gs-imageResult a.gs-title:active b {
    color: #0000CC;
  }
  .gsc-cursor-page {
    color: #0000CC;
  }
  a.gsc-trailing-more-results:link {
    color: #0000CC;
  }
  .gs-webResult .gs-snippet,
  .gs-imageResult .gs-snippet,
  .gs-fileFormatType {
    color: #000000;
  }
  .gs-webResult div.gs-visibleUrl,
  .gs-imageResult div.gs-visibleUrl {
    color: #008000;
  }
  .gs-webResult div.gs-visibleUrl-short {
    color: #008000;
  }
  .gs-webResult div.gs-visibleUrl-short {
    display: none;
  }
  .gs-webResult div.gs-visibleUrl-long {
    display: block;
  }
  .gs-promotion div.gs-visibleUrl-short {
    display: none;
  }
  .gs-promotion div.gs-visibleUrl-long {
    display: block;
  }
  .gsc-cursor-box {
    border-color: #FFFFFF;
  }
  .gsc-results .gsc-cursor-box .gsc-cursor-page {
    border-color: #0170fb;
    background-color: #FFFFFF;
    color: #0000CC;
  }
  .gsc-results .gsc-cursor-box .gsc-cursor-current-page {
    border-color: #0000df;
    background-color: #00cccc;
    color: #0000CC;
  }
  .gsc-webResult.gsc-result.gsc-promotion {
    border-color: #336699;
    background-color: #FFFFFF;
  }
  .gs-promotion a.gs-title:link,
  .gs-promotion a.gs-title:link *,
  .gs-promotion .gs-snippet a:link {
    color: #0000CC;
  }
  .gs-promotion a.gs-title:visited,
  .gs-promotion a.gs-title:visited *,
  .gs-promotion .gs-snippet a:visited {
    color: #0000CC;
  }
  .gs-promotion a.gs-title:hover,
  .gs-promotion a.gs-title:hover *,
  .gs-promotion .gs-snippet a:hover {
    color: #0000CC;
  }
  .gs-promotion a.gs-title:active,
  .gs-promotion a.gs-title:active *,
  .gs-promotion .gs-snippet a:active {
    color: #0000CC;
  }
  .gs-promotion .gs-snippet,
  .gs-promotion .gs-title .gs-promotion-title-right,
  .gs-promotion .gs-title .gs-promotion-title-right *  {
    color: #000000;
  }
  .gs-promotion .gs-visibleUrl,
  .gs-promotion .gs-visibleUrl-short {
    color: #008000;
  }
</style>

Tha Devil · 24 jan 2012

Om het centraal te houden en geen berichten kwijt te raken heb ik beide vragen samengevoegd. Hierdoor is het gesprek qua volgorde wat onlogischer geworden.

De volgende keer kun jij, AndreazZz, beter je bestaande vraag aanpassen of alleen een vraag stellen over het nieuwe probleem.

AndreazZz · 24 jan 2012

Dat klopt, maar ik dacht: dat is een ander onderwerp, dus in feite zou je daar een ander topic voor aan moeten maken? Of hoeft dat niet als het hetzelfde onderwerp betreft?

Tha Devil · 24 jan 2012

Als het aan elkaar gerelateerd is kan dat prima in één vraag

AndreazZz · 26 jan 2012

Bij IEX werkt dat blok nu niet meer. Op Chrome nog wel. Weet iemand hoe dat kan?

Chrome/IEX weergave problemen + zoekmachine werkt niet

AndreazZz

Terugkerende gebruiker

csshunter

Meubilair

AndreazZz

Terugkerende gebruiker

AndreazZz

Terugkerende gebruiker

csshunter

Meubilair

AndreazZz

Terugkerende gebruiker

AndreazZz

Terugkerende gebruiker

That Guy

Meubilair

csshunter

Meubilair

AndreazZz

Terugkerende gebruiker

AndreazZz

Terugkerende gebruiker

csshunter

Meubilair

AndreazZz

Terugkerende gebruiker

Tha Devil

Moderator

AndreazZz

Terugkerende gebruiker

Tha Devil

Moderator

AndreazZz

Terugkerende gebruiker

Nieuwste berichten

Wij waarderen jouw privacy