I have the main HTML page and another HTML page are located in the C:\Users\computer\Pictures. When I run the main HTML page and click on the link to another HTML page, it says "file not found. It may have been moved or deleted. ERR_FILE_NOT_FOUND."
I haven't moved and deleted the files since I saved HTML files in the C:\Users\computer\Pictures.
Here is the HTML code
<div id="Border" class="">
<div id="Topic_List" class="creature">
<ul id="ListName" class="">
<li> home </li>
<li>Life</li>
<li> Interest </li>
</ul>
</div>
</div>
Here is another HTML page
<style>
#Content{margin:5px auto;padding:0;width:600px;height:auto;border:1px solid #666;background-color:#f1f1f1}
#col{margin:5px;padding:0;width:590px;height:auto;}
</style>
<body>
<div id="Content" class="">
<div id="col" class="">
<p><font size="5" >
Hello, Welcome to my home page
</font>
</p>
<h1 align="center"> Activities </h1>
<p><font size="5" >
<ul id="ActivitiesList" class="">
<li> Soccer </li>
<li>Football</li>
</ul>
</font></p>
<p>
</div>
</div>
Try this: I use URIs like this all the time.
<div id="Topic_List" class="creature">
<ul id="ListName" class="">
<li> home </li>
<li>Life</li>
<li> Interest </li>
</ul>
</div>
</div>
If your index.html is in the same folder this should work:
<div id="Border" class="">
<div id="Topic_List" class="creature">
<ul id="ListName" class="">
<li> home </li>
<li>Life</li>
<li> Interest </li>
</ul>
</div>
</div>
If you get "File not found." As I see you got from the other post, go to the file, shift right click and select "Copy Path" Paste that into a notepad to verify the path is correct.
You have a formatting error in C:\\Users\\computer\\Pictures\\home.html. You should use C:/Users/computer/Pictures/home.html. HTML counts C:\\... as 2 slashes, not one. Also, HTML uses forward slashes (/) instead of backslashes (\).
Related
I'm trying to set an image as the background but because it's a browser bases editor, I cannot just link the photo as they are not saved together.
<body>
<div id="backG"> <img src="(image link. i didnt add the link here as it is very long) " alt="concert stadium">
</div>
<div id="mainPage">
<div id="navBar">
<div id="Logo">
<h1 style="font-weight:bold;"> Ice Arena
</h1>
</div>
<ul>
<li style="color:#ffe700;">
Home
</li>
<li>
Gallery
</li>
<li>
Order Form
</li>
<li>
The Arena
</li>
<li>
Contact Us
</li>
< /ul>
</div>
</div>
</body>#
here is the CSS for the photo.
#backG{
diplay:block;
border:0;
}
Free Codepen does not let you host your own images, so you have to upload them somewhere else and link to them. A lot of people use dropbox or imgur
for this. Hope this helps!
The top third of my page, including a graphic and headline, shows up just fine in Firefox and Explorer, but does not appear in Chrome when accessed from my server. It does appear in Chrome when viewing the page as a file.
The graphic is defined in the CSS file as:
/** adbox **/
#adbox {
background: #020a13 url(../images/bg-adbox.jpg) no-repeat center top;
font-family: Georgia, "Times New Roman", Times, serif;
min-height: 433px;
margin: -56px 0 22px;
And the HTML file is:
<!DOCTYPE html>
<!-- Website template by freewebsitetemplates.com -->
<html>
<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>donfiler.net - web design </title>
<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<div id="header">
<div class="wrapper clearfix">
<div id="logo">
<img src="images/logo.png" alt="LOGO">
</div>
<ul id="navigation">
<li class="selected">
Home
</li>
<li>
About
</li>
<li>
Blog
</li>
<li>
Gallery
</li>
<li>
Contact Us
</li>
</ul>
</div>
</div>
<div id="contents">
<div id="adbox">
<div class="wrapper clearfix"><p></p><p></p>
<div class="info">
<h1>Web Design & Social Media Marketing</h1>
<p>
Proven Consultant, Author | Helping Companies Translate Their Business Goals to Reality.
</p>
</div>
</div>
<div class="highlight">
<h2>707-217-8457 if you want a mobile friendly web site.</h2>
</div>
</div>
<div class="body clearfix">
<div class="click-here">
<h1>Impact Marketing</h1>
Click Here!
</div>
<p style="font-size:12px;">
Proven Consultant, Author | Helping Companies Translate Their Business Goals to Reality. We design web sites with dynamic database interaction; deliver computer based training; create comprehensive marketing campaigns; specialize in hand coding HTML, CSS, PHP, Mysql and JavaScript to customize web design and user interface.
</p>
</div>
</div>
<div id="footer">
<ul id="featured" class="wrapper clearfix">
<li>
<img src="images/THUMBNAIL_IMAGE4.jpg" alt="Img" height="204" width="180">
<h3>Order Now</h3>
<p>
Memories of growing up in Europe during the Cold War. The first book in a series about Don's life.
</p>
</li>
<li>
<img src="images/THUMBNAIL_IMAGE3.jpg" alt="Img" height="204" width="180">
<h3>Order Now</h3>
<p>
A catchy tune by the Beach Boys in the mid-sixties, the lyrics of "Be True to Your School" hit many highlights of high school in that era.
</p>
</li>
<li>
<img src="images/THUMBNAIL_IMAGE2.jpg" alt="Img" height="204" width="180">
<h3>Order Now</h3>
<p>
College Years and Rock Band Entrepreneur. The third book in a series about Don's life.
</p>
</li>
<li>
<img src="images/THUMBNAIL_IMAGE1.jpg" alt="Img" height="204" width="180">
<h3>Order Now</h3>
<p>
Contributing to others is the highest form of success you can achieve and I wanted to impart what I have learned over the years working for a living.
</p>
</li>
</ul>
<div class="body">
<div class="wrapper clearfix">
<div id="links">
<div>
<h4>Social</h4>
<ul>
<li>
Google +
</li>
<li>
Facebook
</li>
<li>
Youtube
</li>
</ul>
</div>
<div>
<h4>Blogs</h4>
<ul>
<li>
Blogspot
</li>
<li>
Marketing Blog
</li>
<li>
Web Design Blog
</li>
</ul>
</div>
</div>
<div id="newsletter">
<h4>Newsletter</h4>
<p>
Sign up for Our Newsletter
</p>
<form action="https://donfiler.us/newsletter" method="post">
<!--<input type="text" value="">-->
<input type="submit" value="Sign Up!">
</form>
</div>
<p class="footnote">
© Copyright © 2016 Don Filer all rights reserved.
</p>
</div>
</div>
</div>
</body>
</html>
The Google Chrome extension AdBlock is blocking that element for me, because its ID is adbox. Check if you have that extension enabled, as well.
In general, try avoiding the word "ad" when naming HTML elements.
From the start, I can see a major flaw in the code- you named an element adbox. Most ad-blocking extensions work this way- they scan for ads, and that element will be perceived as an ad, simply because of it's name.
To quote CapitalQ,
In general, try avoiding the word "ad" when naming HTML elements.
Check if you have an ad-blocking extension turned on, and if so, try the site without that extension. Also, rename that element ASAP!
I am working on a mobile web app and have different seperated pages and some with multipages inside.
The footer contains links to the external pages. When im trying to put an anchor link, it wont work. Any solution?
Here are the codes for my footer and my anchor
<div data-role="footer" data-position="fixed" data-id="myfooter">
<div data-role="navbar" id="mainnavbar">
<ul>
<li><a rel="external" href="home.html" class="ui-btn-active ui-icon-fa"><img src="../img/icons/home#2x.png"></a></li>
<li><a rel="external" href="search.html" ><img src="../img/icons/lista#2x.png"></a></li>
<li></li>
<li><a rel="external" href="location.html"><img src="../img/icons/location#2x.png"></a></li>
<li><a rel="external" href="settings.html" ><img src="../img/icons/profile#2x.png"></a></li>
</div>
</div>
Anchor code:
<div role="main" class="ui-content">
<div id="logo">
<img src="../img/LogoSF.png" style="text-align:center" height="auto" width="60%">
</div>
<div id="contenido">
<h1> Bienvenido a Chooser </h1>
<p> Estas a 10 preguntas de encontrar tu plan ideal. </p>
<div id="continuar">
A
</div>
</div>
any solutions?
If you want to disable the ajax link behaviour from an anchor tag, you can put rel=external in the link and the link will load without ajax and your url will then be usual.
http://jquerymobile.com/demos/1.0a4.1/#docs/pages/docs-navmodel.html
like :
<a href="User/somepage" rel="external" />I wont be using ajax for navigation</a>
and here is solution using jquery
$(function(){
$(".content a").each(function(){
$(this).attr("rel","external");
});
});
I'm using 2 languages on my website: Arabic / English
English version: everything is OK.
I'm facing problem with Arabic version only when opening website on Chrome only, if you can check it here online (Arabic):
Here
You will see top margin above header, I'm trying to remove it but I have no idea where it's coming from but it's removed from English version successfully
It will start above .header-wrapper class.
HTML Code :
<div class="header-wrapper">
<div id="welcome">
<form action="http://staging.wain.com.kw/index.php?route=module/language" method="post" id="language_form" enctype="multipart/form-data">
<div id="language">
<a title="English" onclick="$('input[name=\'language_code\']').attr('value', 'en'); $('#language_form').submit();">
English
</a>
<input type="hidden" name="language_code" value="">
<input type="hidden" name="redirect" value="http://staging.wain.com.kw/index.php?route=common/home">
</div>
</form>
<span>مرحبا بالزائر يمكنك</span>تسجيل الدخول<b>أو</b>تسجيل جديد
<div class="links">
حسابي <ul>
<li>حسابي</li>
<li>سلة الشراء</li>
<li>إكمال الطلب</li>
</ul>
</div>
قائمة المقارنة
قائمة رغباتي (0)
</div>
<div id="header" class="sunset">
<div id="menu">
<span>Menu</span>
<ul>
<li class="home"><a title="الرئيسية" href="http://staging.wain.com.kw/index.php?route=common/home"><span><i class="icon-home"></i></span></a></li>
<li>أكواب
</li>
<li>الإكسسوارات
</li>
<li>بوستر
</li>
<li>سماعات
</li>
<li>ملابس
<div>
<ul>
<li>تي شيرت (19)</li>
<li>طويلة الأكمام (2)</li>
<li>قبعات (2)</li>
<li>هودي (3)</li>
</ul>
</div>
</li>
<li>ملصقات
</li>
</ul>
</div>
<div id="logo"><img src="http://staging.wain.com.kw/image/data/logo2.png" title="WAIN" alt="WAIN"></div>
<div id="cart">
<div class="heading">
<h4><i class="icon-shopping-cart"></i><!--سلة الشراء--></h4>
<a><span id="cart-total">سلة الشراء فارغة!</span></a></div>
<div class="content">
<div class="empty">سلة الشراء فارغة!</div>
</div>
</div> </div>
</div>
CSS Code:
.header-wrapper {
max-width: 1200px;
margin: 0px auto 0px;
}
Thank you.
Right after you <body> tag there is a lot of white-space. remove it and the space is gone.
It's generally recommended to keep the markup as clean as possible to avoid porblems like this in the future.
<body>
<meta charset="UTF-8">
After the body tag, there is a whitespace. You need to remove that white space to avoid the margin top.
I'm trying to create a simple thumbnail list, the code is pretty much copied off jqm docs pages. However, when I use the code below the button element of the list isn't anchored to the left of the list item and instead appears centered...Can anyone help me? It's driving me crazy!
I haven't got any styles in other than what is in the jquerymobile default page template
<div id="listDiv" class="ui-content" data-role="main">
<div id="listInformation" data-role="content-primary">
<ul id="swipeMeChildrenList" data-role="listview" class="ui-listview">
<li data-corners="false" data-shadow="false" data-iconshadow="true" data-wrapperels="div" data-icon="arrow-r" data-iconpos="right" data-theme="c" class="ui-btn ui-btn-icon-right ui-li-has-arrow ui-li ui-btn-up-c">
<div class="ui-btn-inner ui-li">
<div class="ui-btn-text">
<a href="index.html" class="ui-link-inherit">
<img src="images/album-p.jpg" class="ui-li-thumb">
<p>Ha</p>
</a>
</div>
<span class="ui-icon ui-icon-arrow-r ui-icon-shadow"> </span>
</div>
</li>
</ul>
</div>
</div>
What code do you use to generate your list from? A simple list will be specified like this:
<ul data-role="listview">
<li>
<a href="index.html">
<img src="images/album-p.jpg" />Ha
</a>
</li>
</ul>
jQuery Mobile will take care of adding all the necessary classes depending on the platform.
I suggest opening a new document and using the defaults from that page, ie
<ul data-role="listview">
<li><a href="index.html">
<img src="images/album-bb.jpg" />
<h3>Broken Bells</h3>
<p>Broken Bells</p>
</a></li>
</ul>
Then if that works, piece by piece replace the code with yours until it breaks, that should isolate the issue.