Sometimes a “save” will delete “the closing html tag” at the end of a file.
This, in turn, causes a syntax error on the page and the code editor stops being live.
This is also true if using VS Code
I’m finding the same thing. I thought it was only when using VS Code.
Just a FYI I have seen this for some time going back to ver 3 PG in Bootstrap 3 plain html sites. I do a visual scan and fix the ones that are missing the /html> … it showed up sometime back then but is sporadic, thought it might be something I was doing wrong while stripping code in the head or menu bar areas that caused the save to knock that out …
This has been an intermittent (and sometimes consistent) issue that I’ve addressed for months. It used to do this all the time with Atom, and I dumped it and moved to VS Code and there doesn’t seem to be a problem now, at the moment. I also haven’t noticed any issues with PHPStorm. And yes, with Bootstrap 3 projects, this seems to be consistent.
I do hope this gets addressed soon for others, as I also struggled with it. I think I’m just lucky for the moment. So, not your imagination.
@mxs @RobM please post or DM the HTML source of the page where you’re getting this issue. In most cases such behaviour is connected with HTML syntax errors (unclosed tags, mismatched tags…) on the page.
We only need the HTML code, not the whole project.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>Ireland B&B Owners Association</title>
<meta name="description" content="B&B Accommodation">
<meta name="author" content="B&B Owners Association">
<!-- Bootstrap core CSS -->
<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/style.css" rel="stylesheet">
<link href="css/all.css" rel="stylesheet">
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body itemscope itemtype="http://schema.org/BedAndBreakfast">
<nav class="navbar navbar-expand-lg navbar-primary bg-primary">
<div class="container">
<a class="navbar-brand ml-4 brand bold" href="https://bnbowners.com" target="_pg_blank">Ireland B&B Owners</a><button type="button" data-target="#collapseNavbar" data-toggle="collapse" class="navbar-toggler"><span class="navbar-toggler-icon"></span>
</button>
<div class="navbar-collapse collapse" id="collapseNavbar">
<ul class="navbar-nav mx-auto">
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="research.php" id="dropdown01" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" target="_pg_blank"><i class="fa fa-fw fa-home"></i> Home</a>
<div class="dropdown-menu" aria-labelledby="dropdown01">
<a class="dropdown-item" href="about.php" target="_pg_blank"><i class="fa fa-fw fa-info-circle"></i> About Us</a>
<a class="dropdown-item" href="#" target="_pg_blank"><i class="fa fa-fw fa-question"></i> FAQ</a>
<a class="dropdown-item" href="#" target="_pg_blank"><i class="fa fa-fw fa-key"></i> Privacy Notice</a>
</div></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="membership.php" data-toggle="dropdown" target="_pg_blank"><i class="fa fa-fw fa-id-card"></i> Membership</a>
<div class="dropdown-menu">
<a class="dropdown-item" href="full-membership.php" target="_pg_blank"><i class="fa fa-fw fa-reply-all"></i> Full Membership</a>
<a class="dropdown-item" href="ass-members.php" target="_pg_blank"><i class="fa fa-fw fa-reply"></i> Associate</a>
<a class="dropdown-item" href="members.php" target="_pg_blank"><i class="fa fa-fw fa-hotel"></i> Our Members</a>
<a class="dropdown-item" href="faq.php" target="_pg_blank"><i class="fa fa-fw fa-question"></i> FAQ</a>
<a class="dropdown-item" href="dashboard.php" target="_pg_blank"><i class="fa fa-fw fa-wrench"></i> Owners Dashboard</a>
<a class="dropdown-item" href="bookingengine.php" target="_pg_blank"><i class="fa fa-fw fa-credit-card"></i> Booking Engine</a>
<a class="dropdown-item" href="tutorial/" target="_pg_blank"><i class="fa fa-fw fa-graduation-cap"></i> Tutorials</a>
<a class="dropdown-item" href="nes.php" target="_pg_blank"><i class="fa fa-fw fa-newspaper"></i> News</a>
<a class="dropdown-item" href="bnb-chat.php" target="_pg_blank"><i class="fa fa-fw fa-user"></i> Owners Chat</a>
<a class="dropdown-item" href="blog/" target="_pg_blank"><i class="fa fa-fw fa-pen-square"></i> Blog</a>
<a class="dropdown-item" href="websites.php" target="_pg_blank"><i class="fa fa-fw fa-globe"></i> Our Network</a>
</div></li>
<li class="nav-item dropdown">
<a class="nav-link dropdown-toggle" href="#" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false" target="_pg_blank"><i class="fa fa-fw fa-user"></i> Info / Help</a>
<div class="dropdown-menu" aria-labelledby="dropdown02">
<a class="dropdown-item" href="prostate-cancer.php" target="_pg_blank"><i class="fa fa-fw fa-walking"></i> What is PC</a>
<a class="dropdown-item" href="#" target="_pg_blank"><i class="fa fa-fw fa-newspaper"></i> News</a>
<a class="dropdown-item" href="#" target="_pg_blank"><i class="fa fa-fw fa-phone-square"></i> Contacts</a>
</div></li>
<li class="nav-item"><a href="#" class="nav-link" target="_pg_blank"><i class="fa fa-fw fa-phone"></i> Contact</a></li>
<li class="nav-item"><a href="https://my-bnb.com" class="nav-link" target="_pg_blank"><i class="fa fa-fw fa-lock"></i> Members Login</a></li>
</ul></div></div>
</nav>
<!-- End of Nav -->
<div class="container bg-white py-4 brb">
<div class="row">
<div class="col-lg-4 col-md-12"><img class="mx-auto d-block img-fluid" src="img/bnboa.png" alt="B&B Owners Association"></div>
<div class="col-lg-8 col-sm-12"><h1>Working together to compete more effectively</h1> <p>The <a href="https://ireland-bnb.com" target="_blank" data-toggle="tooltip" title="The most comprehensive Guide to Bed and Breakfast in Ireland">Ireland B&B</a> Owners Association (BOA) exists to represent its members online and using collective Internet marketing to lower the cost of bookings. Guests are encouraged to book directly by <a href="#" data-toggle="tooltip" title="Booking Directly - No Online Travel Agents Commission" target="_pg_blank"><b>phone, email or booking engine</b></a>. This approach minimises commission on your bookings, the cost of online promotion and improves your profitability. <a href="members.php" target="_pg_blank"><img src="img/members-list.png" data-toggle="tooltip" data-placement="left" title="Check who's a member of the B&B Owners Association in your area" class="tilt float-right ml-2" alt="Ireland B&B Membership List" width="100" height="119"/></a>Our booking system provides a <a href="#" data-toggle="tooltip" title="we are PCI DSS Compliant" target="_pg_blank">safe and secure environment</a> for credit card booking.</p><p>Today the BOA offers a welcome alternative for B&B Owners caught in the trap of high commission, cancelations and monthly commission bills.</p></div></div> <hr>
<div class="row align-items-center ">
<div class="col-md-6 col-xs-12 bg-white"><img class="img-fluid " z-index="100" src="img/welcome.jpg" alt="B&B Owners Membershi"></div>
<div class="col-md-6 col-xs-12 pt-3" id="offset">
<h3>Full or Associate Membership</h3>
<p>Full Members pay <b>No Commission</b> on bookings. Associate Members pay a small commission. Owners get notification bookings of bookings by email / SMS text that includes the guests name, email & phone number. Choose a membership level that suits your situation, budget & skill level.
<a href="membership.php" class="btn btn-outline-primary mb-3 float-right mt-2" target="_pg_blank">More Information</a></p>
</div></div><hr>
<div class="row align-items-center">
<div class="col-md-6 col-xs-12 pt-3" id="offset2"><h3>Non Member Advertising</h3>
<p>To provide a wider service to guests we include non-member advertising in all our websites. Your B&B property is displayed in our portals, directories and regional websites in the same way as our full and associate members but redirects guests to your existing website or booking service.
<a href="advertiser.php" class="btn btn-primary mb-3 float-right mt-2">More Information</a></p></div>
<div class="col-md-6 col-xs-12 bg-white"><img class="img-fluid " z-index="100" src="img/bedroom.jpg" alt="B&B Owners Membership"></div>
</div>
<hr>
<div class="row align-items-center ">
<div class="col-md-6 col-xs-12 bg-white"><img class="img-fluid " z-index="100" src="img/database.jpg" alt="B&B Owners Membershi"></div>
<div class="col-md-6 col-xs-12 pt-3" id="offset">
<h3>National B&B Database</h3>
<p>We also manage the National Database of Irish Bed & Breakfast accommodation.
This is published online as a reference source for both the public and the travel trade. <a href="register.php?grade=free" class="btn btn-primary float-right mb-3 mt-2" target="_pg_blank">Add your B&B</a></p>
</div></div><hr>
</div></div>
<!-- end container -->
<!-- Bootstrap core JavaScript
================================================== -->
<!-- Placed at the end of the document so the pages load faster -->
<script src="js/jquery.min.js"></script>
<script src="js/popper.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script></script>
</body>Just checked this using VS Code and it seems to happen on save.
If the file is saved without the tag, then there are problems with the live display when making changes in either the built-in editor or VS.
I have just saved with the internal editor but upon opening in VS the tag is missing again.
Hi there, I just copied your code and dumped it into Pinegrow and it immediately gave Syntax error warnings about
Id=“offset” not being unique
and
missing opening <div>on line 168
here you go this is an image to show this,
If I then click the Yellow apply changes button at the top,
pinegrow warns me There be Dragons here! - if you DO apply this
with this pop up
and yep!
sure enough.
after I save the broken code, which I was warned NOT to save, … I loose the final <html> tag
So!
The big red crosses on the left indicate where you should be looking to fix this, DONT save it it with errors (Kaboom! it breaks - the yellow warning bar) and if you look at the COLOR HIGHLIGHTING of the 2 divs that follow the final red warning cross - you will see the color of the text change on the 2nd one form blue (which is good! ) to WHITE - in the middl of the tag, after the / .
This is not so good!
you have one too many </div> s
Delete that last one and save it and it all works great. -although you still need to address the ID thing.
PineGrow flips out after warning you not to save the file with broken syntax, then deletes the final closing tag - that being </html> instead of the EXTRA </div> tag, which shouldn’t be there.
case closed 
I checked it here, and there are a LOT of errors.
so there are!
35 apparently! But
not as overwhelming at it first appears as about 27 of them to turn out to be
Bad value “_pg_blank” for attribute “target” on element “a”: Reserved keyword “pg_blank” used.
So that is just down to PineGrow doing its thing until there are actual REAL values stuck in there.
about 3 *Z index8 errors that.I dont quite get
Pinegrow doesn’t pick them up, so I’m not sure what the error means when it says
Attribute “z-index” not allowed on element “img” at this point.
Then there is
The ID error and the Extra Div.
so!
Not so bad over all then 
PS
there is also a typo on line 83
"B&B Owners Membershi"></div>
not sure if that is missing a P or a T at the end there 
Even when it shows 50 errors they all tend to get fixed once you fix the very first one.
So don’t despair. Just go to the top and see what needs a fix.
If you hover over the line number error it usually gives you a big hint.
Pinegrow likes perfection and it’s made me far more aware of sloppy past efforts. (by others of course)
1 Like
The z-index errors are arising because you can’t set a z-index in an tag like you can set the height and width. The correct way would to be to do it as an inline style, also setting the position at the same time because z-index only works with positioned elements.
ah cheers yes.
I was wondering if it should have been declared in the style sheet! I mixed my html/css things up in my head.
And I should have known better as I was just looking at it on your Banner images of the site link you sent me previously too - Doh!
I was just too lazy to check I guess, but thanks
and
z-index only works with positioned elements.
I didn’t recall that! cheers
This was an issue I’ve reported many times before, despite having clean code, and the issue quickly went away after I switched away from Atom as the editor. I’m now using PHPStorm and VS, and no issues. Yes, PG can provide validation and a warning, but when that’s not present and the closing HTML tag is not being saved, I’ve found it to be an issue with how it behaves when connected to Atom. FYI.
1 Like