Jump to content

Wickham

Advanced Member
  • Posts

    1,114
  • Joined

  • Last visited

  • Days Won

    5

Posts posted by Wickham

  1. Well, I'm not a PHP expert so you may have to wait for Ben.

     

    However, we can't see the php code when we look at the source code of your page because it's been processed.

     

    You say "If I remove the php code that is before the <!DOCTYPE ..." there should be nothing in front of the doctype, not even spare lines.

  2. Edit this code in the head section style tag:-

    #content img {
    margin:0px; display: block; float: left;
    }
    

     

    The img element is normally an inline element and margin won't process on an inline element so make it a block element.

     

    It may only solve part of your problems, but it's a start.

     

    Your actual image size is 188*188px not 180*180px so edit all the markup sizes to delete the 180px sizes (you don't need sizes unless you want to resize the image)

    <img src="images/bed.jpg" />
    
    <img src="images/bed.jpg" />
    
    
    <img src="images/bed.jpg" />
    
    
    <img src="images/bed.jpg" />
    
    
    <img src="images/bed.jpg" />
    
    <img src="images/bed.jpg" />
    

    and edit the #content style width to 5 * 188px = 940px; and the margin: auto will center it.

    #content {
    
    width: 940px; /*916px;*/
    padding:0px;
    background:#D9D9D9;
    margin-left:auto;
    margin-right:auto;
    margin-top:  50px;
    }
    
    
    

  3. The / in front of favicon will only work with an online page, not from a local file unless you have Apache server and are using it to view the page.

     

    If you have uploaded your page and the favicon.ico into the root directory online, clear your cache (while your browser is looking at another page because the cache may not clear the page showing on the screen) and then download the page again.

  4. id names, class names, meta tags, title tags

    CSS like these:-

    body { color: red; }
    #wrap { }
    .left { }
    

    HTML markup:-

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
           "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    
    <head>
    
    <meta name="keywords" content="Memoirs" />
    
    <title>My Memoirs</title>
    
    <meta http-equiv="content-type" content="text/html; charset=utf-8" />
    
    <link rel="stylesheet" href="style2.css" media="all" type="text/css" />
    
    <style type="text/css">...........</style>
    </head>
    <body>
    .................content......
    </body>
    </html>
    

    It isn't necessary for the doctype which can be lower case. It's advisable to code filenames and extensions in lower case like index.html or picture.jpg as mixing lower case and upper case can cause a problem if the case is different in the html markup from the actual filename as most hosting services are case sensitive (although IE locally isn't).

  5. You're using an XHTML doctype which requires lower case for element and attribute names, including meta tags.

     

    I've just tested one of my files with META which gave three errors inluding the one you describe, but when I reverted to meta that I had before, I got no errors.

  6. As usual, the Dropbox website doesn't tell us everything. Wikipedia has some background info:-

    http://en.wikipedia.org/wiki/Dropbox_%28service%29

    regarding lack of security

    and this site

    http://www.theregister.co.uk/2012/05/02/apple_dropbox_blocking/

    regarding Apple blocking Dropbox

     

    The dropbox site says that it works even when offline

    https://www.dropbox.com/features

    I don't understand how it can sync with the cloud or other computers if you are offline. However, it looks very useful and I will probably give it a try but I will probably want to sync with an old XP computer and I'm not sure if it will do that.

  7. Ben's probably right, your files probably have .txt added on the end of the filename that shouldn't be there.

     

    When you have been coding in Notepad (or probably most other text editors) and you want to save the file for the first time, use Save As (instead of Save) and type your filename like index.html or contact.php and then make sure Save As Type is All Files (*.*) and not Text Documents (*.txt).

     

    Then check that Encoding is ANSI not UTF-8.

     

    After the first save, you should be able to click Save instead of Save As after future edits.

  8. If you want to see a .html or .htm file displayed in a browser, double click the filename in your file list like Windows Explorer and it should open your default browser, or right-click and "open with" another browser.

     

    You cannot see a .php file displayed properly in a browser from a local file unless you have WampServer2 or XAMPP installed as these have Apache server to process the PHP, so check these online or install one of the programs.

     

    CSS files when double-clicked should open in Notepad if css files are set to open in Notepad or you can right-click choose program.

     

    Don't use Word for coding as some characters like " and ' can carry unwanted hidden code which affects the display.

  9. It's not the "#FPMap0" or "FPMap0" which are correct: name="FPMap0" and usemap="#FPMap0". Firefox doesn't like the "a" tag inside the map element. You have:-

    <map name="FPMap0">
    
    <a href="/Portals/0/ForbesMap/audio-Forbes-AV-
    International.htm#LiveContent[ForbesMap]" 
    target="_blank" alt="Forbes-AV, Tony Janesin">
    
    <area class="pointer" 
    href="/Portals/0/ForbesMap/audio-Forbes-AV-
    International.htm" shape="POLY" alt="Forbes-AV, Tony 
    Janesin" target="_blank" 
    coords="211,148,196,120,202,112,196,94,186,100,182,75,1
    90,75,204,75,205,57,198,31,194,22,183,18,182,7,195,9,19
    9,14,278,46,330,53,405,51,453,44,458,44,456,54,465,57,4
    71,79,478,74,505,80,518,90,533,96,556,95,557,108,561,12
    2,577,136,586,136,577,110,573,104,584,95,589,76,581,59,
    573,56,568,48,571,38,568,28,563,23,566,16,560,12,563,3,
    572,3,579,3,586,0,602,8,609,11,612,5,617,8,618,24,625,3
    1,637,35,643,20,641,12,641,4,647,11,653,19,659,22,659,3
    4,667,35,675,54,679,66,658,70,662,76,657,84,666,92,675,
    99,687,99,682,84,689,80,693,92,733,69,737,73,738,82,727
    ,104,710,110,723,120,701,124,707,138,688,152,681,155,67
    9,162,671,166,669,180,668,191,659,196,644,203,624,214,6
    22,219,609,224,602,232,599,239,585,242,573,251,568,250,
    576,239,582,230,579,223,582,218,579,212,561,204,548,197
    ,544,186,532,182,524,173,513,174,503,185,485,186,477,18
    1,468,182,458,176,400,174,379,174,320,166,278,158,228,1
    46,226,155" />
    </a>
     <!--and the others-->
    
    </map></p> 
    <div align="center">
    <img border="0" alt="" src="images/A-V-repmap-03.01.12
    -for-website.jpg" width="740" height="468" 
    usemap="#FPMap0" /></div>
    

    but I can get Firefox to operate links if the "a" tags are removed:-

    <map name="FPMap0">
    <!--<a href="/Portals/0/ForbesMap/audio-Forbes-AV-
    International.htm#LiveContent[ForbesMap]" 
    target="_blank" alt="Forbes-AV, Tony Janesin">-->
    
    <area class="pointer" 
    href="/Portals/0/ForbesMap/audio-Forbes-AV-
    International.htm" shape="POLY" alt="Forbes-AV, Tony 
    Janesin" target="_blank" 
    coords="211,148,196,120,202,112,196,94,186,100,182,75,1
    90,75,204,75,205,57,198,31,194,22,183,18,182,7,195,9,19
    9,14,278,46,330,53,405,51,453,44,458,44,456,54,465,57,4
    71,79,478,74,505,80,518,90,533,96,556,95,557,108,561,12
    2,577,136,586,136,577,110,573,104,584,95,589,76,581,59,
    573,56,568,48,571,38,568,28,563,23,566,16,560,12,563,3,
    572,3,579,3,586,0,602,8,609,11,612,5,617,8,618,24,625,3
    1,637,35,643,20,641,12,641,4,647,11,653,19,659,22,659,3
    4,667,35,675,54,679,66,658,70,662,76,657,84,666,92,675,
    99,687,99,682,84,689,80,693,92,733,69,737,73,738,82,727
    ,104,710,110,723,120,701,124,707,138,688,152,681,155,67
    9,162,671,166,669,180,668,191,659,196,644,203,624,214,6
    22,219,609,224,602,232,599,239,585,242,573,251,568,250,
    576,239,582,230,579,223,582,218,579,212,561,204,548,197
    ,544,186,532,182,524,173,513,174,503,185,485,186,477,18
    1,468,182,458,176,400,174,379,174,320,166,278,158,228,1
    46,226,155" />
    <!--</a>-->
     <!--and the others-->
    
    </map></p> 
    <div align="center">
    <img border="0" alt="" src="images/A-V-repmap-03.01.12
    -for-website.jpg" width="740" height="468" 
    usemap="#FPMap0" /></div>
    

    but I don't know what that will do to the way you want the map to work. It isn't usual to have an "a" tag there. It should be in the format:-

    <map name="my-map">
    <area shape="rect" href="introduction.php" coords="10,1,75,30" alt="Introduction">
    <area shape="rect" href="generaladvice.php" coords="95,20,170,50" alt="General Advice">
    </map>
    <img usemap="#my-map" src="images/map-image.jpg" alt="Map"> 
    

  10. When you have coded a page, check it in these places:-

    HTML markup http://validator.w3.org/

    CSS code http://jigsaw.w3.org/css-validator/

    Outline http://gsnedders.html5.org/outliner/

     

    Remember that books may be out of date, look for a revision date if you can find one.

    Online tutorials may also be out of date, so look at several and try to make up your mind which is most up to date.

    When you have a specific coding problem, or validation errors you con't cure, post a question on a forum like this.

    Start with a simple page and just practise making it more complicated.

    Good luck.

  11. I mean is there like a list somewhere that will tell me X will not work in IE, X will not work in firefox, etc

     

    I have an image placed using css and I am getting problems in I.E. The image is in front of everything else, as it should be, however in I.E. it's behind the navigation.

     

    Look at this http://caniuse.com/ and click on any item.

     

    Always code and get it right in Firefox or Chrome or Safari first, then consider what you have to do in conditional comments for any or all IE versions. The conditional comment should be after your main stylesheet link to overide it. Conditional comments will not overide inline styles (those inside tags).

     

    If the image is behind the navigation in IE, consider a position (absolute, relative or fixed) for the parent div of the image and also add a z-index for that. You have done it for the navigation and sometimes that's enough, but doing it for both with different z-index values may work.

  12. This page http://www.wickham43.net/highlighthome.php shows several methods.

     

    The first item is very basic and not suitable for inclusion in an "include" file.

     

    The second and third items are similar, for text links or image links, both using only CSS and a "matched pairs" coding. You put the li tags in the "include" file and put a different id or class to the ul tag or body tag on every page, so the id or class for the ul or body tag will only match one of the li tags on each page, changing its style. In the third item I deliberately coded it so that the About Us tab disappears on the About Us page, as it's not wanted for its own page, and only the other tabs show.

     

    The fourth item is using PHP.

  13. Note that you have lt IE9 when there should be a space between IE and 9:-

    <!--[if lt ie 9]> your different styles here  <![endif]-->
    

     

    The above code should go in the head section AFTER the main stylesheet link or after the head section style tags so that it supersedes them. Styles written inline (inside html tags) will take priority over those in a conditional comment.

     

    It should work from a local file or online.

     

    the teacher talks about the code "lt IE9". Normally it should work with any browser.

    The lt IE 9 conditional comment should work with all IE browsers less than IE 9 (assuming that your styles inside the conditional comment are appropriate and supported by the IE version).

  14. When I input the contact_us.php page (pointing to contactprocess.php) from localhost I get the following erro:

     

    Your message has been sent

    Warning: mail() [function.mail]: "sendmail_from" not set in php.ini or custom "From:" header missing in C:\xampp\htdocs\contactprocess.php on line 21

     

    It's much better to test from an online page where the email PHP code will be processed by your host's server.

     

    If you want to test sending an email from localhost on your pc you will have to edit the php.ini file in WampServer or XAMPP as follows:-

    http://roshanbh.com.np/2007/12/sending-e-mail-from-localhost-in-php-in-windows-environment.html

    and also use Apache Server in one of those installations. Set the smtp server name of your ISP where the example has SMTP = smtp.wlink.com.np the smtp.wlink.com.np might be smtp.supanet.com or smtp.your-isp.com

    and edit smtp_port = 25

    The php.ini file may take some finding in all the files WampServer or XAMPP give you and then the php.ini file has a lot of content and you have to find the correct places to edit.

     

    Make sure you add the $headers = ‘MIME-Version: 1.0′ . “\r\n”;

    $headers .= ‘Content-type: text/html; charset=iso-8859-1′ . “\r\n”;

    in your process file.

    • Upvote 1
  15. If you are happy with the online version, why not download it and overwrite the copy in your Dreamweaver on your computer?

     

    I notice that the code in your first post has all the words correctly like CHEF DIPLOMA COURSE instead of just CHEF, so that also seems to be the correct version and can be used to overwrite the Dreamweaver version.

  16. When I said "This site, if used with javascript/ActiveX, will show which browsers support which elements:" I meant that your browser should have javascript/ActiveX enabled, but the site does work if javascript is disabled.

     

    In general, I suppose it's better to use HTML5 and CSS3 for special features if the feature you choose is well supported, then use Photoshop if HTML5/CSS3 is not well supported. That's the future way. HTML5/CSS3 will probably be smaller KB and quicker processing.

  17. HTML5 and CSS3 go together and are an advance on HTML 4.01 (or XHTML 1.0) and CSS2. Some features in HTML5 and CSS3 are not supported yet by all browsers, so be careful. This site, if used with javascript/ActiveX, will show which browsers support which elements:

    http://caniuse.com/# (just click on an item on the index page).

     

    Photoshop is for designing images, essentially. You can use it to create a web page but many developers don't approve of that. Just use it for design effects and then code manually or with Dreamweaver in manual mode (Dreamweaver is expensive, many people start by using a simple text editor like Notepad or Notepad++).

  18. Anyways, I was wondering if there is some sort of template or setup you use when coding a page as far as divs go. They seem to be confusing once

    you get a lot of them in the code. Do you have more than one wrapper div? (ex. 1 around the heading div, 1 around the main content div, ect.) or do you

    just have one wrapper/container div around all the content? It's hard to get out what exactly i'm trying to say lol.

    As few as you can. Some people get "divitis" using divs everywhere and lots nested inside others which are nested inside others. However, it is a good idea to have one page wrapper because you may want to center the whole page in wide windows and a page wrapper makes that easy. Most developers would have a div for the header and another for the footer if there are several items inside, like a logo, title and menu (although a new HTML5 structure would use the new <header>, <section> and <footer> tags instead of <div> tags).

    Also, on the float property, is it, or positioning better for layouts?

    Generally try to use floats (which are part of a position: relative structure) with margins to keep a space between them and an adjacent floated div, instead of position; absolute with top, left, right or bottom positions. It should make a more fluid layout.

    One more question, I've seen where some people use ul and li for layout instead of using them for actual list.

    Is that a good technique? or just bad practice? Can someone shed some light on this? If it is a decent technique can someone explain to me how i would

    use that for layout?

    Lists using ul and li tags are just one method of structuring a page, often used for menu tabs. Most content would normally be in divs; list tags are for lists or short bits of content in a line or vertically.

  19. E-commerce often uses PHP. It's best to download a package and install it and then edit it, as security issues are very important and you shouldn't try to code an e-commerce site manually from the beginning.

     

    If you want to use server-side processing for PHP, you can either test online after uploading to your host or download Apache server inside WampServer2 or XAMPP which will give you phpmyadmin to code PHP and also MySQL in case you need a database.

     

    Most people start using PHP for "include" files which mean you only have one file to edit and you can include the code like a menu on lots of pages with a .php extension

    <?php include ("header.inc"); ?>
    

    where header.inc is the "include" file

×
×
  • Create New...