This code is from view-source in Chrome:
<div class='pedSpouse'>Relation med <a class='familylink' file='157' pers='24351162'><strong>KARL EMRIK Jakobsson</strong> f. 1897</div></div><div> <img id='pedMore' src='cmn/prg/pics/hpil.png'></div></div></div>
In inspect the img is embedded within a copy of the previous a tag:
<div><a class='familylink' file='157' pers='24351162'><img id='pedMore' src='cmn/prg/pics/hpil.png'></div>
The same thing occurs in two other places.
With other data the code is as expected.
Same thing happens in Edge.
I have no idea where the extra code comes from.
Your HTML is broken. Examine its structure:
<div class='pedSpouse'>
Relation med
<a class='familylink' file='157' pers='24351162'>
<strong>
KARL EMRIK Jakobsson
</strong>
f. 1897
<!-- You didn't close the "a" element -->
</div>
</div> <!-- You close a "div" element that was never opened -->
<div>
<img id='pedMore' src='cmn/prg/pics/hpil.png'>
</div>
</div> <!-- You close a "div" element that was never opened -->
</div> <!-- You close a "div" element that was never opened -->
The rendered HTML is different from the page source because the page source is invalid and the browser is doing its best to make sense of it. Use well-formed HTML for more control over how the HTML is interpreted by the browser.
Hint: When your HTML isn't doing what you expect, the very first step is to validate it. The runtime behavior of invalid code is always undefined.
Related
I was trying to make this code as below.
PHP code I wrote:
$i = 1;
<div class="sampleNumberIndex">
<p>
<h2> <?php echo $i; ?></h2>
</p>
</div>
Made code that I expected
<div class="sampleNumberIndex">
<p>
<h2> 1 </h2>
</p>
</div>
But php code made this.
<div class="sampleNumberIndex">
<p> </p>
<h2> 1 </h2>
<p> </p>
</div>
I'm using chrome, what did make it like that?
That has nothing to do with PHP. It's just that html doesn't want you to wrap h2-tags in p-tags. You should rather use divs, regardless of what you are trying to accomplish here.
You are probably looking at Inspect Element section which repairs bad HTML codes. Real source codes are available at View page source section. Try Ctrl + U to view source code.
It's not very clear from your question, but I suppose you're seeing the unexpected tags in the browser's DOM inspector. "Show Page Source" should show you the actual raw HTML your browser received.
Edit: what #AliN11 said
HTML infers tags when missing in content. In your case, the HTML browser knows that h2 can't appear in the content of a p element, hence it adds the </p> end-element tag before h2. Then after the h2 element, it encounters the </p> end-element tag, and inserts a <p> start-element tag before it, because none is open at the context position.
The first insertion - that for the </p> end-element tag - is part of the regular parsing rules for HTML; omitting </p> is allowed according to the HTML specification. But the second insertion - that for the <p> start-element tag - is not, and is an effect of HTML recovery (repair) kicking in.
I've explained HTML/SGML tag insertion in detail on the project page of my SGML software and the linked slides of a talk I gave about it last year.
There is a pattern node is inserted into the slider (in an item):
<div class="item"> <!-- Wrap contents -->
<div class="image"> <!-- Insert image-->
<img src="<?=file_create_url($content['field_img_slide_1']['#items'][0]['uri'])?>"alt=""/>
</div>
<div class="desc">
<h2><?=$content['field_h1_slide_1']["#items"][0][value];?></h2> <!--Insert title-->
<div class="info"><?=$content['field_h2_slide_1']["#items"][0][value];?></di><!--Insert title 2-->
<?=$content['body']["#items"][0][value];?> <!--Insert text -->
</div>
</div>
The code of the slider:
<div class="m-slider">
<div class="sliderBox">
<?php print render(module_invoke('views', 'block_view', 'flock_salon-block_1')); // These items are inserted for the slider ?>
</div>
</div>
When I have only one slide, everything is displayed perfectly. When I add the second slide, it is displayed under the first (incorrectly displayed)
Slider screenshot: http://i65.fastpic.ru/big/2014/0807/96/25ac215abd233ee409ed3dd6459ced96.png
The second slide lies on top of the first
What prescribe in the template node to fix slider displaying?
This most often occurs when there are errors in running javascript code or finding a javascript file/library. Open up your developer tools (F12 in most major browsers) and check the console for errors that may be halting your code before it gets to rendering the slider functionality.
I have the following problem. I used the following code in my page to ignore some php code, but it seems that over the Thanksgiving weekend there was an update and it is no longer ignoring the code.
<!--
<div class="main">
<div class="main-sub">
<?php include('http://www.contractorsintelligence.com/contractors-license/includes-page-elements/navigation1.php');
?>
<div id="mid-top"><img src="" width="990" height="20" alt="Top Spacer"/></div>
<div id="mid_shdw">
-->
The rest of the html code is being ignored, but only php code is not being ignored. I know one of the ways is to include <!-- into the php function. But is there any other way to ignore the php code with the rest of the html code?
This is an HTML comment. It has no effect on the PHP code.
You should use PHP comments:
Block comment:
/*
BLOCK OF COMMENTED CODE
*/
Line comment:
// this is a commented line
The PHP code is interpreted by the server and is calculated "long" before it gets to the users browser. The HTML markup while still on the server, is just text. Only when the HTML arrives at the users browser does it get rendered (or ignored!). So your HTML comments did not matter to the server - it saw PHP code and ran it - the PHP interpreter is not programmed to recognize these strange <!-- symbols that you are giving it. ;)
Your PHP code will always be executed because it doesn't know about your HTML code that surrounds it.
The solution, if you your PHP code not to execute is to comment it out:
<!--
<div class="main">
<div class="main-sub">
<?
// php include('http://www.contractorsintelligence.com/contractors-license/includes-
// page-elements/navigation1.php');
?>
<div id="mid-top"><img src="" width="990" height="20" alt="Top Spacer"/></div>
<div id="mid_shdw">
-->
<?php /* comments */ ?>
The PHP is executed before the HTML is processed client-side.
If you want to ignore the PHP code, its your best bet to do it like this:
<?php
/* include('http://www.contractorsintelligence.com/contractors-license/includes-page-elements/navigation1.php'); */
?>
Whereas /* starts a comment and */ ends it.
PHP will parse the page before it is sent to the client (or browser). Therefore PHP is not 'interested' in <!-- or --> at all.
On the other hand, if the HTML code that is being included by your call to include() contains further HTML commentary (<!-- or -->) it may close your ignored code before the point you intended it to.
UPDATE
Your overall approach is a bit fuzzy. See here, if you want to use PHP to decide whether to show certain HTML code or not, you don't want to use HTML comments to accomplish that.
Try this instead:
<?php
if($result["r_approved"] != "APPROVED"){
?>
<div class="main">
<div class="main-sub">
<?php
include('http://www.contractorsintelligence.com/contractors-license/includes-page-elements/navigation1.php');
?>
</div>
<div id="mid-top">
<img src="https://www.contractorsintelligence.com/images/shadowbg-top.png" width="990" height="20" alt="Top Spacer"/>
</div>
<div id="mid_shdw"></div>
</div>
<?php
}
?>
You php page is executed and everything between <? ?> is executed. Php doesn't care about <!-- --> or any other tag except <? or <?php .
Then the browser doesn't display/load what is inside <!-- -->.
If you want to comment php, use // or /* ... */
<?php /* include('http://www.contractorsintelligence.com/contractors-license/includes-page-elements/navigation1.php'); */ ?>
Two things are happening at once which I think might be confusing:
Unless you wrap everything inside the php tags with /* */ or use // that code will be executed because it comes from the server.
The browser is the only one that parses the <!-- -->.
So your server is parsing the php and then the browser is hiding what was parsed.
Solution
<?php // include('http://www.contractorsintelligence.com/contractors-license/includes-page-elements/navigation1.php'); ?>
Thats because the <!-- isn't parsed by PHP, only by the browser. The easiest (but not always best readable) solution is
<?php if (false) { ?>
<b>This html will not be sent to browser</b>
<?php include('this will not be included'); ?>
<?php } // endif ?>
The <div id="page>" and <div id="pagecontent"> don't show in on my webpage. In Firebug, the "Script" tab shows that index.php has both of these divs in it, but the HTML tab doesn't show either div. Why?
All of the content is generated by PHP, and everything shows correctly on the page except for these two divs. Both divs are immediately after the <body> tag. The active website with this problem can be found here.
HTML document:
<?php include "topofpage.php" ?>
<!--Main Content Area-->
<div id="main">
<!-- TABLE HTML GOES HERE, BUT IT'S KINDA LONG AND BORING AND THE PROBLEM ISN'T HERE SO I TOOK IT OUT -->
<!--Copyright Notice-->
<p><br />
<div id="divdate">© 2009-2025 Poet Slam. All rights reserved.</div><br />
<script type="text/javascript">
var divisiondate=document.getElementById("divdate"); var newdater=new Date(); var years=newdater.getFullYear(); divisiondate.innerHTML="© 2013-"+years+" Poet Slam. All rights reserved.";
</script>
</div> <!-- THIS CLOSES THE <DIV ID="PAGECONTENT"> CREATED IN THE EXTERNAL PHP FILE
</div> <!--THIS CLOSES THE <DIV ID="PAGE"> CREATED IN THE EXTERNAL PHP FILE
</body>
</html>
it's a small thing, but looking at line 49 in the page source you have an unclosed comment
<!--CREATE A POEM * TAG DRAG AND DROP->
Running the page as it stands through the W3CValidator - http://validator.w3.org/ - shows that causes a few errors that might be throwing the DOM parser.
As a first step I'd suggest fixing that, and iterating through the validator to at least knock off the (unexpected) errors
In this text
<div class="foo" <!-- onclick="bar();" --> /></div>
the /> is being shown within the browser (Chrome) and on iOS devices. My first guess was to delete the / from the <div> but then the > was still being shown within the browser, woe is me!
Solutions?
EDIT:
After discussing with the OP, it was found that the onclick method was still needed, so the solution was to use <div class="foo" onclick="bar();"> </div> without the 'commented code' in it.
Original answer:
Try - <div class="foo" <?php /* onclick="bar();" */ ?> > </div> which will result in <div class="foo"> </div>. Notice that the entire thing is filtered by your PHP.
For JSP/ASP, use <%-- --%> style comments. <div class="foo" <%-- onclick="bar();" --%> > </div>
Remove the comment. My guess is that the browser is interpreting the comment close as the end tag. Just put the entire div in a comment, with a different version below.
Comments are forbidden inside tags, so your HTML is wrong.
If you want a comment, put it after the end of the tag:
<div class="foo"> <!-- onclick="bar();" --> </div>
Additionally, you should not have a / character at the end of the start tag for a div.
In HTML (before 5) it closes the start tag, so you add a > character to the data. Most browsers do not respect this (your problem is due to the comment though).
In HTML Compatible XHTML it is forbidden.
In XHTML it makes the div a self-closing tag, so the end tag has no matching start tag.
In HTML 5 it is, IIRC, forbidden.
The comment (<!-- -->) is markup that the browser is supposed to ignore.
In this case, your markup is invalid because you are nesting a markup within markup in an invalid way. You will need to delete the "onclick="bar();" or move the entire comment out of the opening div tag.