Greetings, web designers!
I'm getting an html error when I copy and paste the html code for a Google Map embed. Here is what it says:
"The 'frameborder' attribute on the 'iframe' element is obsolete. Use CSS instead."
And here's the code (copied directly from Google Maps):
<iframe src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d12608.912218734722!2d-122.42538575928587!3d37.80812692913063!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0x808580fa79aee3b9%3A0xd0ce5b8bf914906a!2sFisherman's+Wharf%2C+San+Francisco%2C+CA%2C+USA!5e0!3m2!1sen!2sde!4v1505807894509" width="600" height="450" frameborder="0" style="border:0" allowfullscreen></iframe>
Where am I going wrong? (Sorry if this is silly question... I'm new to this world.)
Thanks in advance for your help!
Full Version: html error: embedding a google map
I assume you mean a validator error?
This is the FRAMEBORDER attribute in your IFRAME code example (with its value set to zero):
They simply want you to remove that, because CSS is considered a better way to style iframe borders (it doesn't hurt anything by keeping it, though).
The code example already has that here:
(though it's more practical to use stylesheets instead of inline styles in STYLE attributes).
QUOTE
"The 'frameborder' attribute on the 'iframe' element is obsolete. "
This is the FRAMEBORDER attribute in your IFRAME code example (with its value set to zero):
CODE
frameborder="0"
They simply want you to remove that, because CSS is considered a better way to style iframe borders (it doesn't hurt anything by keeping it, though).
QUOTE
Use CSS instead
The code example already has that here:
CODE
style="border:0"
(though it's more practical to use stylesheets instead of inline styles in STYLE attributes).
QUOTE(Christian J @ Sep 19 2017, 05:24 AM) 
I assume you mean a validator error?
QUOTE
"The 'frameborder' attribute on the 'iframe' element is obsolete. "
This is the FRAMEBORDER attribute in your IFRAME code example (with its value set to zero):
CODE
frameborder="0"
They simply want you to remove that, because CSS is considered a better way to style iframe borders (it doesn't hurt anything by keeping it, though).
QUOTE
Use CSS instead
The code example already has that here:
CODE
style="border:0"
(though it's more practical to use stylesheets instead of inline styles in STYLE attributes).
Ah, so it's sort of giving redundant instructions then. I wonder why Google Maps does this? Is it to accommodate both systems, html and CSS?
Thanks for your help!
Hmmm... seems I am hitting more walls here. Trying to embed an image... what am I doing wrong here?
<img src=" https://goo.gl/images/1rM6uV" style="width:128px;height:128px;">
<img src=" https://goo.gl/images/1rM6uV" style="width:128px;height:128px;">
QUOTE(jokerrules @ Sep 20 2017, 09:09 AM)
Ah, so it's sort of giving redundant instructions then. I wonder why Google Maps does this? Is it to accommodate both systems, html and CSS?
Yes, in the beginning HTML attributes where used for styling, but once CSS became common such presenational HTML attributes have been outdated. Maybe Google includes them as a fallback for ancient browsers, but that doesn't make sense since such browsers wouldn't support much else on the web either.
QUOTE(jokerrules @ Sep 20 2017, 04:00 PM)
Hmmm... seems I am hitting more walls here. Trying to embed an image... what am I doing wrong here?
Seems the URL redirects to an HTML page. Not sure why, maybe it's some kind of anti-hotlinking functionality.
The HTML looks correct, though you might add an ALT attribute and remove the space before the URL, but I don't think that should matter:
CODE
<img src="https://goo.gl/images/1rM6uV" style="width:128px;height:128px;" alt="">
I think the link to the image is
https://i.pinimg.com/564x/b6/9c/ea/b69cea60...90ede60797c.jpg
https://i.pinimg.com/564x/b6/9c/ea/b69cea60...90ede60797c.jpg
This is a "lo-fi" version of our main content. To view the full version with more information, formatting and images, please click here.