Jump to content

newbielearner

Members
  • Content Count

    17
  • Joined

  • Last visited

Community Reputation

0 Neutral

About newbielearner

  • Rank
    Newbie
  1. I've tried to search for the specs for the default style sheets used by IE and Firefox but have not been successful. Can someone who knows point me to where I can find them? Thanks!
  2. I have a list of links. They are broken into groups of links. In order to indent the links, I use CSS to format the "list items containing links" as blocks so I can set text indent. it worked for both IE6 and Firefox 2. But I've noticed that if a link includes a space at the end (just before the </a> tag, it messes up the formatting in IE6. The space between that list item and the next list item dissappears. I've included the code below. I've included the ending space in Links Num 2 and Link Num 10. Can anyone please educate me on why this happens? Is this a bug or am I doing something wrong? If so, how can I work around it? Finally, any pointers on a better way to indent the links?Thanks! <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" /><title>Untitled Document</title><style type="text/css"><!--#linkList a { text-indent: 2em; display: block;}--></style></head><body><div id="linkList"> <h2>Links</h2> <ul> <li>Link Grounp 1</li> <li><a href="link num 1">link num l</a></li> <li><a href="link num 2">link num 2 </a></li> <li><a href="link num 3">link num 3</a></li> <li><a href="link num 4">link num 4</a></li> <li>Link Grounp 2</li> <li><a href="link num 5">link num 5</a></li> <li><a href="link num 6">link num 6</a></li> <li><a href="link num 7">link num 7</a></li> <li><a href="link num 8">link num 8</a></li> <li>Link Grounp 3</li> <li><a href="link num 9">link num 9</a></li> <li><a href="link num 10">link num 10 </a></li> <li><a href="link num 11">link num 11</a></li> <li><a href="link num 12">link num 12</a></li> </ul></div></body></html>
  3. Thank you Sniffy and lilyofthevalley for your encouraging remarks. I will update the copyright to 2007 NOW!Here's wishing all of w3schools forummers a wonderful year ahead!
  4. Thanks to boen_robot, I've managed to convert my table-based layout into CSS-based list. I would not have thought about using floated LIs to get the effect. But the clear:both on elements within the LI didn't seem to have any effect, so I'd to use <br /> to separate the caption from the thumbnail.Something I learnt is that setting an element's display property to BLOCK forces it to be BLOCK at the document level. I'd thought it would only make it a BLOCK element WITHIN its parent element. Please correct me if I'm wrong. I tried to use inline-block to no avail. I'm still pretty confused over how to render table-based layout using CSS-based list. eg. how does one achieve the vertical alignment of table cells with variable length content? Let's say each Item comprises a Text Title, a thumbnail and a description. Using tables, I would use one TD for the Text Title, one TD on another TR for the thumbnail, and one TD on yet another TR for the description. All the rows would be nicely aligned vertically even if their content heights are different. How do I do that using CSS-based lists? as an example of what I'm describing see the second table on this page.Cheers.
  5. I'm trying to convert the layout tables in my site into CSS formatted lists... and I'm pulling my hair out. I've uploaded two versions of my attempts at getting it right. In both versions, the original desired Table layout is below the List based one. Also I've kept each thumbnail with its caption in the same list item since they belong together.In this first try, based on what my limited knowledge of how CSS should work, I can't get the thumbnail to go below the text caption. whether by using <br /> or by setting the IMG tag to BLOCK. Setting IMG tag to BLOCK seem to set the entire LI to Block as well.In this second try second try I followed boen_robot's hint and floated left the LI tags. It worked for Firefox 1.5 but didn't work too well for IE6. Also, I can't seem to get the captions to align center and become bold like in the Table (I can't seem to find out how I managed to turn the caption in the TABLE to bold! How silly!)Should I repost this in the CSS thread since this posting is purely CSS? Cheers.
  6. The following is my three step plan based on your pointers (THANKS) and my aptitude as I figure out each technique:1. Provide a currency exchange tool <as suggested by reportingsjr>. All prices indicated in S$ only.2. Display 2 prices for each item in S$ (the reference) and foreign currency (indicative estimation) <as suggested by justsomeguy>. The visitor will have to choose the foreign currency he/she prefers.3. Figure out how to read and write cookies <as suggested by Jesh>. I believe I can do step 1 now. Step 2 should be okay unless I get caught by the JS problems I'd previously encountered. Step 3 is completely new to me. In fact, I wonder if it's possible to "sniff" from the visitor's browser/XP/Domain/host (I'm clueless here) settings the local currency of the visitor and automatically set the foreign currency accordingly? That way the visitor doesn't even have to make a choice.Cheers
  7. Thanks for your encouragement, reportingsjr and boen_robot.Dear boen_robot,Although I've solved the JS problem, I still hope to find out one day why it didn't work, as it uses a seemingly elementary technique that I would have kept on using in the future. But I'm happy to have found an alternative method (through trial and error) that works.On the CSS table, I'll be trying it. Thanks for your instructions. I update the site about once a week, when I relist the jewellery on eBay. So any changes will not be immediate.My next few action item is figuring out how to add a currency converter to the prices so that it can automatically calculate and display the prices in the local currency of the visitor (and also give the visitor a choice). At the very least, it should be able to display prices in the main international currencies (eg. US$, UK Stirling Pounds, AUD$ etc) No clue how it's done. Hopefully I'm not being too ambitious - any pointers on how to go about doing it?
  8. Thanks jesh and Tarte for your compliments. I've adopted jesh's suggestion and modified the style of the main nav.Also regarding the javascript problem that I had with the links - I've managed to solve it - just in case you go to the site and try to replicate the problem. I'm using onclick to trigger the javascript function rather than the HREF attribute in the A tag. I still don't understand why the first method didn't work. I just wish I'd find out one day.Thanks again to all who gave your valuable comments.
  9. Actually, you can simulate the effect quite closely. Just click "Restore Down" button on the top right corner (to the left of the Close button) of the Photoshop application window. Then just resize the application window down. That way, you can see your computer desktop, your graphics file that is opened, and your photoshop toolbars, palettes and menus.Hope that helps. ps. if you're into color correction of your photos for example, the usual advise is to use the grey background, so your colour sense is not affected by a colourful desktop picture.
  10. Hi,Sorry for the late reply. Just returned from overseas and have just completed some of the action list based on the helpful comments here. The updated site design is at the same address here. Again, comments and critiques are most welcome. The following are some of the changes I've made:1. Layout has been centered. Didn't add a border (which I liked) cos' the boss (wifey) preferred no borders.2. Lowered the subnavigation breadcrumbs in the Tips & Treats section to make it more obvious. Considering whether to do the same for all other navigation submenus in the other sections.Still hasn't figured out the javascript problem so I reverting to manually updating all the links.Thanks to everybody again for your valuable comments. I really appreciated it!To boen_robot,Thanks for the tip on using the meta tags for refreshing pages after a specific date. I was considering using it but got frightened off when Danny Goodman in his book (Javascript Bible) warned that the browsers are rather inconsistent in implementing meta tags nocache flag. In fact, I got the idea from him to force the server to reload by adding a date based variable to the URL after the specific date. It seemed to work so far so I'll leave it for the time being although it must look terribly amateurish to experienced scripters. I'll also be changing the table based layout for the thumbnails to list based once I've figured out how to do it properly using CSS.To boen_robot and reportingsjr,I've encountered the same javascript problem on Google and previously on my ISP host. Next step for me is to look for a paid host that supports server-side scripting and PHP/MySQL database. But I'm leaving that till i'm more gen up on PHP/MySQL and till the products inventory gets bigger. But THANKS to reportingsjr for offering to code the PHP for me. I'll write to you when I get my act together.sigh... so many things to learn... so little time... Thanks for the feedback. Can I check which browser you are using? I test my pages on IE6 and Firefox 1.5 on XP. I had the jitter problem on Firefox on images that were links. I thought I'd solved the problem by removing the hover style for images. Pls let me know your browser so I can replicate the UGLY jitter defect
  11. Thanks , boen_robot for your detailed reply.The reason I wrote the javascript was to meet 2 needs:a. allow normal caching so that visitor do not need to reload all the thumbnail on every visit to the page.b. set an expiry date after which the browser would be forced to reload the page & thumbnails. (the expiry date is when the listing numbers are changed and new items are added).As you pointed out, this won't work if javascript is disabled. Using the Meta method, can the visitor's browser be forced to reload ONLY after a preset expiry date?On using CSS instead of tables, I tried that but my skill level in CSS is not up to scratch yet, since I've only just started on CSS. I'll try the method you suggested.On using lists for the menu, I tried to use left border as separator before each item, but that would put add a border before the first item as well. I understand the CSS for specifying the first element is not well supported across browsers yet. I'm still experimenting to use lists.As for the main problem, you're right, I can't use server side script cos' google doesn't support it yet, and also my database is not very big yet, and I'm still learning PHP/MySQL. As for the symptom, let me elaborate so you can duplicate it. Say there are 20 thumbnails on the earrings page . Let's say after 8 thumbnails are loaded and displayed, the visitor clicks on any of the thumbnails (while the OTHER thumbnails are still loading) - that's when the problem manifests itself. The page stops loading, the new window does not open, clicking on the javascript links on the earrings page do not open the relevant page either. Only thing for the visitor to do is to reload the page, wait for the thumbnails to fully load, then the javascript links will work (I'm sure no visitor will stick around for that and I don't blame her).If I can't find a solution, I'll have to manually update each link throughout the site. Apart from horribly tedious, it really irks me and drive me nuts because I can't understand why it doesn't work!!!Dear Ible-White,I'm so glad you've accepted my apology, and that I won't get spanked this time I'll think through those pointers you've given me to see how I can revamp my site. But so much to learn and so little time, sigh.Thanks again all for your comments.
  12. First, thanks all for your time and prompt replies. It really is very encouraging. My wife is absolutely amazed at how polite everybody here is. And I do want to apologise for addressing Ible-White as he.I have made a "to do" list based on the comments: 1. I'll shift the alignment to centered. 2. Actually, I've just started learning about CSS and is very excited about it. But I'm sticking to the simpler ones as I'm worried about browser incompatibilities. 3. Will try some other placement tomake the links more obvious. 4. boen_robot, are you referring to the javascript for renewing the page? I'm sure it's very clumsy. I was worried visitors would be viewing the outdated cached version of the page. So I wrote that bit of javascript. If there's a proper way to do it, I'd love to learn it. 5. I definitely value the comments on the layout and looks. But yes, there's one javscript I'm using in the listing pages that's troubling me. I tried asking before but probably didn't make myself clear, so I'll try again here. In this page from the site, I've used a javascript function to link each thumbnail to the relevant eBay listing. The URLs are stored in a small database contained in a javascript Array element.This arrangement works if the visitor clicks the thumbnail after ALL the thumbnails in the page has loaded - it opens another window showing the relevant eBay listing page. Problem is: if the visitor clicks a thumbnail while other thumbnails are still loading, then the page stops loading and the eBay page is NOT opened. Sometimes, the eBay page is opened, but my thumbnail page is still "freezed" as in it stops loading the other thumbnails. This problem occurs whether the javascript is in the external .js file or embedded within the thumbnail page itself. If I can't find a solution to this, I'll have to hardcode and update every link in the site every time the eBay listing number of all the items change (using the javascript, I just need to update the javascript Array) and that is horribly tedious. I've included extracts of the javascript code below. Help!Thanks again for the feedback. I'll post again after the next iteration.Extracts of the javascript code:An example of the javascripted link in the HTML file:<a href="java script:gotoListing('b30020');">GardenDelight Beautiful Czech Glass Bracelet</a> Extract of the javascript function and the "database": var ebayBaseUrl = "http://cgi.ebay.com.sg/ws/eBayISAPI.dll?ViewItem&item=";listingUrl = new Array();listingUrl[50024] = ebayBaseUrl + "190044349595";listingUrl[80004] = ebayBaseUrl + "190044349584";listingUrl[50041] = ebayBaseUrl + "190044349577";listingUrl[30019] = ebayBaseUrl + "190044349571";listingUrl[10013] = ebayBaseUrl + "190044349563";// the list here has been truncatedfunction gotoListing(itemNum) {// extracts the 5 character number from the prodNum, removing the alphabet prefix. eg. 50023 from e50023.var extractedNum = itemNum.substring(1,6);parseInt(extractedNum);window.open(listingUrl[extractedNum],'');} Thank you
  13. Hi,I am doing this site for my wife as a labour of love.It's not completed as yet--> I'm looking at how to improve it.CLICK HERE FOR THE SITEAnyway- I just wanted to hear what you think of it so far.Don't try to soften the blows- just yell it out!Any suggestions, comments, critiques?ps- I was inspired by Ible-White posting requesting feedback on his site - and the warm response to his posting. So I'm hoping for a similarly candid comments from the helpful forumers here. And erm, this is NOT an attempt to get you to buy anything from my wife's site. I'm interested in the web development aspects of the site.thx
  14. Hi,Can someone please help out? Thanks!
  15. Thank you for the reply, Jesh. Actually, I would like the opposite - I'd like the javascript to load before anything else, so that the surfer can start clicking on the links if they see a picture of an item they like - even before the rest of the pictures load. At the moment, the link .js statement is in the head section, and when I transfer the javascript code to the TOP of the HTML page, the problem still occurs. In fact, I would like the page to continue loading while the new window is being opened. At present, not only does the new window not open, the HTML page stops loading. Cheers!
×
×
  • Create New...