Jump to content


Advanced Member
  • Posts

  • Joined

  • Last visited

  • Days Won


Posts posted by Wickham

  1. I've got a test form working to show the data on the same page after processing and it works well but I've had to insert

    error_reporting (E_ALL ^ E_NOTICE);

    to get rid of this notice:-

    Notice: Undefined index: sendit in C:\wamp\www\test\test-form4a.php on line 10

    which is if($_POST['sendit'])


    The php on first loading the page ignores the echos to display the data and uses the "else" to display the form. When the submit button is pressed the page loads again and $_POST['sendit'] then has some data to process, but on the first pass the sendit is undefined.


    I've tried making it a variable like





    $sendit = $_POST['sendit'];

    but the notice still shows and the form doesn't process.


    I've also tried putting the variable is different places.


    Is there a way to get it right without the exception code?


    PHP test
    This is testing WampServer2.
    error_reporting (E_ALL ^ E_NOTICE);
    $rating = $_POST['rating'];
    $item = $_POST['item'];
    echo  "You rated {$item} as {$rating} out of 10.";
    echo "
    Thank You.";
    { echo "Please submit form";
    <form action="test-form4a.php" method="post">
    Song 1
    Song 2
    Rating (out of 10 please):  

  2. Add the closing tag to th efirst li tag (as I mentioned last time!):-


    Your li tag images total 905 px; your #wrapper is 910px but #navbar is 910px plus margin-left: 5px totalling 915px so edit this to:-









    Neither of the above were causing the scrollbar in IE7, which can be cured by deleting the position: absolute here:-


    #navbar li ul{






    Add this (not essential, just a safety measure):-


    #navbar ul, #navbar li, #navbar ul ul, #navbar li li { margin: 0; padding: 0; }

  4. I've also had trouble with CSS menus in IE8 beta 2 and no one's sure if they will be cured in the final release. The only certain way is to use the emulate IE7 meta tag so that all viewers with IE8 see the page and work dropdown menus using simulated IE7 put this:-



    just after the

    tag of the page so that IE8 viewers will see the menu without needing to use Compatibility View (not lower down in the head tag as it often doesn't work unless it's the first item in the head).


    Use /> instead of > closing tag if using XHTML.


    With regard to positioning, display inline and float: left both seem to be used. Sometimes the display: inline doesn't work but a lot of codes use display: block for the li tag so float: left has to be used, but many times I've seen both used (belts and braces!).

  5. You need the background-color as well as the gradient background-image so that if the page is longer than the gradient image (for instance if someone increases text size and it needs more height) the page doesn't just stop and show white.


    body { background: url(gradient.jpg) repeat-x #2df68c; }


    make the background-color the same as the bottom of the gradient so they merge.


    Like JBall's code or mine above which is a shorter version in one style instead of three separate styles. Note that it starts with background: not background-image:

  6. This works (minor edits to echo line and I've shown an alternative):-


    br />"http://www.w3.org/TR/html4/strict.dtd">
    PHP test
    <form action="process.php" method="post">


    process.php file:-


    br />"http://www.w3.org/TR/html4/strict.dtd">
    PHP test
    $quantity = $_POST['quantity'];
    $item = $_POST['item'];
    echo  "You ordered"." $item"." nr"." $quantity";
    echo  "
    You ordered {$item} nr {$quantity}";



    Load both files into htdocs folder (or www if using Wamp or WampServer)


    It shouldn't matter if order.html is order.html or order.php

  7. When I open order.html in IE and fill in the form and click submit, I get a window asking me if I want to open or save process.php


    You have an error here in the html file; I've added an extra " before post"



    I think the echo line code is wrong in the process.php file; it raises a php error.


    Also try renaming as order.php if it still doesn't work.

  8. I used these styles:-

    input { border: 1px solid red; padding: 2px; font-size: 1em;


    background-color: #F8F8F8; }

    input:focus { border-color: lime; background-color: #FFFE9D; }

    input.image { border: 0; padding: 0; }

    input { background: url(images/cornerBR.gif); }


    which are the same as your's except that I changed to color to red, plus the background image; and this markup:-


    • Name:
    • email:
    • Message:
    • Select product:
    • Service





    • Male




    where the first li tag for "name" has had the class="image" added and does NOT show a red border.

  9. I've been using WampServer but I think I'm opening files in a long way and there must be a quicker way.


    I open WampServer and click the "put online" item and then click "localhost" which opens http://localhost/ with the index file in Firefox. I then have to type my filename like test.php into the browser window so that it says http://localhost/test.php and the file opens in Apache.


    If I go into the Windows Explorer folder wamp/www and double click the filename it opens in my default browser which is still IE and I realise that that won't work.


    If I right click "open with" Firefox it opens but without using wamp and Apache.


    What I would like to see when I right click "open with" is an option for localhost or WampServer but it isn't there and if I browse for a program for localhost, where would I find it? Ideally I would just like to doubleclick a filename in the wamp/www folder but I realise I will have to change the default browser to Firefox (Firefox is the default for WampServer but not for everything else).

  10. Add

    above ..............line 4.<p> </p> <p>target="_blank" line 138; don't worry too much about this; it's deprecated (old code) but still works. Learn an alternative later.</p> <p> </p> <p>A lot of codes are in the format </p> <p></p> <p class="MsoNormal" style="margin: 0.3in 0in 0pt; line-height: 180%;">?</p> <p> </p> <p>using MsoNormal and then pt for text size. Have you used Microsoft Word and then "saved as" HTML? This creates all sorts of old-fashioned code that doesn't validate. You really need to start again in Notepad or another text editor or Dreamweaver and not use Word or Excel.</p> <p> </p> <p><em>cannot generate system identifier for general entity "address".</em></p> <p><em>?imarks.org/bookmarks.php/?action=add&address=http%3A%2F%2Fwww.ilovemoneymoret</em></p> <p> </p> <p>This means that & is not validating; you need to use the character code for it which is & see </p> <p><a href="http://www.tedmontgomery.com/tutorial/HTMLchrc.html" rel="external nofollow">http://www.tedmontgomery.com/tutorial/HTMLchrc.html</a></p> <p> </p> <p><em>end tag for "input" omitted, but OMITTAG NO was specified.</em></p> <p><input name="hl" value="en" type="hidden"></p> <p> </p> <p>If you use XHTML doctypes this must be closed as /> not just ></p> <p> </p> <p>I'm not going to offer any more comments; you really need to learn to code in a text editor or use a program like Dreamweaver or spend a lot of time editing what you have now. Sorry.</p>
  11. If you have a page that is over about 750px wide I would NOT rewcommend the second link which uses position: absolute; left: 50%; margin-left: (negative half the div width). What happens is that in viewports smaller than the div width the left side slides out to the left where you cannot scroll to reach it. This method is only suitable for small divs.


    Use the method in the first link which is a width: ???px; margin-left: auto; margin-right: auto; (or just margin: auto;) which makes the side margins equal so that the div will center. The disadvantage is that this method does not work with a position: absolute containing div, use either no position or position: relative.


    See http://w ww.wickham43.net/centeringdivs.php

  12. I don't understand this:-


    $to = "robert.cfi@gmail.com";

    $from = "someonelse@example.com";

    $headers = "From: $from";



    echo "Mail Sent.";


    The viewer is sending the email to you, so $to is your email (OK so far but don't show it forums!)


    His email is the variable $Email so I think $headers should be

    $headers = "From: $Email";


    and the $from should not be there at all.


    Check all lower case and upper case I think you are OK but check.

  13. For the dotted top border create a space in the style before the color:-


    Same with footer:-

    #footer {




    color: #48381F;

    font-size: 10px;

    border-top:1px solid #48381F;

    border-bottom:1px solid #48381F;

    text-align: right;


    Same for inner_right:-

    #inner_right {






    border-left:1px dotted #A8A8A8;




    At the moment your hover color #48381F; (brown) in menubox a:hover is working in Firefox and in IE7. .menubox a:link and .menubox a:visited have color:inherit; which comes from .menubox which is #EDE0BE (cream) so that is working in Firefox but IE7 does not operate inherit for color, only background-color so edit:-

    .menubox a:link {





    font-size: 12px;



    .menubox a:visited {





    font-size: 12px;




    -The amont of space between "About Nick" (h2 element) and the line underneath(on gallery and contact pages) is different in IE.


    It's the same on the index page (after curing the dotted top border); you have converted h2 from a block element to an inline element with display: inline and it has lost the default margins. If you want to leave it as an inline element add a line-height 1.3 or 1.4:-

    h2 { line-height: 1.3;



    font-size: 22px;




    If you want the small image blocks.gif to be on the same line as the h2 heading, edit the markup to add display: inline like the h2:-

    About Nick...


    Edit the Gallery and Contact pages the same way.


    (If you delete the display: inline to turn it back into a block element, add margin-bottom: 4px; instead of the line-height, but then you may have positioning problems with the image blocks.gif which is just before it, so I found it best to do the display inline edits above.)


    I can see that the patterned background shows on the right in IE6; cancel the default body margin (20px) which seems to be the problem:-

    body {

    background-image: url("images/body_bk.jpg");


    color: #48381F; margin: 0;



    why have you got #wrap as position: absolute? I don't think it needs to be. You can also delete position: absolute as well as adding the above body margin: 0; but it doesn't seem to be necessary to do this:-

    #wrap {




    font: 14px/16px Arial, Helvetica, sans-serif;



  14. I think that if they copy the code, I'd take it as a compliment, but if they copy content and especially images, that would be infringing copyright.


    As I've written my own tutorial I expect people to copy my code, and of course if you put anything up on the web you must expect people to take it.


    I set up a village website with a photo of the village hall. A year later someone set up a village hall website and used my photo, even using the same filename! I discovered that he lived quite cose to me although I didn't know him. I emailed through his webpage email and said that I had listed his site as a link on my site and would he like to reciprocate and credit my photo, which he did. I thought it was cheeky to take my photo, he must have known that I'd notice. Edit: I actually wish he had used some of my code because his is diabolical!

  15. If the container has a fixed width and two side divs have unequal width you need to use item 7 here to position the middle div equally between them (but not centered in the page):-

    http://w'>http://w ww.wickham43.net/threecolumns.php

    which means that you have to state a width for each side div, you can't leave them flexible, and then the middle div has a calculated margin-left.


    If the container is flexible to 100% and has no stated width like your div, then you have to use position: relative for the container and position: absolute for the two side divs if they have unequal width. It looks odd because the middle div is central on the page in both IE and Firefox but is closer to one side div than the other. Use 1024*768 resolution with this code:-

    style="float:left;background-color:red; position: absolute; top: 0; left: 
    Side divs have no width but different widths of text (or different stated 
    widths). Middle div centers on the page in both IE and Firefox which 
    means that it's closer to one side div than the other. Use 1024*768 
    resolution to see the effect best.


    Look at the 3 examples at the bottom of the page in IE7 and in Firefox to see the difference (use 1024*768 to see the effect best):-

    http://w ww.wickham43.com/forumposts/ferdy090117.html

  16. Two correct answers :/ but it's worth noting that it only works when the two side divs are the same width (or as in this case have no defined width and have the same length of text) Try it with "teeeeeest" in the left div and "test" in the right div in a large enough screen resolution (I reduced the middle div to 900px to see the effect in my 1024*768px resolution).


    IE centers the middle div in the space between the two side divs (which is not central on the page if the side divs have unequal width) while Firefox centers in the whole page (which means the center div is closer to one side div than the other if they have unequal width).


    See item 6 here in IE7 and then in Firefox:-

    http://w ww.wickham43.net/threecolumns.php

    which shows the effect if the side divs are unequal.

  17. @ Wickham:


    HA! That's hilarious! Did you read the first post on the designerstalk forum? It was started by "mukesh_designer" the same bloke who started this thread. In fact its the same question verbatim... :lol:


    It also shows how quick Google is in scanning pages and listing them. It was today's post that it picked up and showed very near the top of my search list; amazing, I'm always using Google and nearly always impressed.


    It's also interesting to see how some other forums have a laugh at the expense of the new members :(

  18. I've come across this before. I checked all your table cells, even adding extra ids which you had in the same column for the input boxes and a background-color:-

    /* Below sets 'Item Code' cell width */

    #item-code, #item-code-box {

    background-color: violet;

    width: 120px;



    but that wasn't necessary (if you set a width for one, the others below should be the same width), but it helped me check that nothing was wrong there.

    I checked the actual input boxes and put a background-color on them:-


    /* Below changes the 'Item Code' input box styles */

    #item-code-box input {

    width: 100px;


    border: 1px solid #666;

    background-color: fuchsia;/*#f1f1f1;*/

    margin-right: 20px;



    All was OK but then I realised that the id="item-code-box"> has javascript inside and I've noticed before that this can add a hidden margin somehow, so I disabled all the javascript like this in each item by disabling the input box:-


    onChange="javascript:validateSKU(document.m.sku2.value, '2')"



    and IE7 reduced the width to 120px (Firefox showed it still 120px)


    so somehow you have to edit the javascript, which is beyond me.

  19. I did a tracert on www.killersites.com and it showed 14 hops and 94ms UK to USA

    My own website showed 7 hops and 22ms all UK

    Numion in Netherlands for the speed test from UK was 9 hops and 25ms


    It was the UK business day but before the US business day so I'm surprised it was so much slower than from my own website.


    Numion shows the speed to/from its server of 4392kbps but it also does a simulated world-wide internet route downloading lots of icons from different countries which showed average 146kbps, but downloading your tutorial was coming in at 80 to 240kbps so I suppose it was achieving the same as Numion's average for outside UK.

  • Create New...