Jump to content

sayed2x2

Members
  • Posts

    9
  • Joined

  • Last visited

sayed2x2's Achievements

Newbie

Newbie (1/7)

1

Reputation

  1. I tried that in safari and its showing the same, there doesnt seem to be any problem. probably you would need to delete you cookies.screenShot: http://ammasbiryani.com/wp-content/uploads/2013/02/button.png
  2. So what's the big deal just add one more condition is the funtion just add, (I have addes one extra for the empty input) <html><body><label>INPUT:</label><input type="text" id="input" /><input type="submit" onclick="changeValue()"/><div id="alert"></div><script>function changeValue(){var userinput= document.getElementById("input").value;var output= userinput*4+2;document.getElementById("alert").innerHTML=output;if(isNaN(userinput)){document.getElementById("alert").innerHTML="Please Enter a Number to view a result";}else if(userinput==''){ document.getElementById("alert").innerHTML="Please Enter a Number you idiot"; }}</script></body></html>
  3. The best way to create a responsive design is to use media-query. its very easy you just have to target different screen sizes and write css for it. just google for media query there are plenty of nice tutorials for it.
  4. Your question is not clear. Do you want us to write the code for you ? Here is a code that I wrote from whatever little a understand from your question. <html ><head><style>#leftarea{float:left;}#rightarea{float:left;margin-left:100px;}input{}</style></head><body><div id="leftarea"><p><label>Customer:</label><input type="text" placeholder="Name of the company" /></p> <p><label>Address:</label><input type="text" placeholder="Enter the Address" /></p></div><div id="rightarea"><p><label>Invoice No.:</label><input type="text" /></p><p><label>Handled By:</label><input type="text" placeholder="Please Enter the name" /></p><p><label>Date:</label><input type="text" /></p></div></body></html> clearify your question and I 'll write the correct code for you.
  5. It cannot be done only with HTML(since this is html section), javascript will be required.so here is the code that I wrote. <html><body><label>INPUT:</label><input type="text" id="input" /><input type="submit" onclick="changeValue()"/><div id="alert"></div><script>function changeValue(){var userinput= document.getElementById("input").value;var output= userinput*4+2;document.getElementById("alert").innerHTML=output;}</script></body></html>
  6. I question is not very clear however if are having problem with aligning the tex and the input field , I would suggest you to make different classes or Ids like.container1{widht:200px;margin:0px 0px auto;height:400px;} create a table using <tr> and <td> tags under every class because this way you will be able to align them the way you want. If you make your question a little more clear , I can create the exact table for you, get in touch on facebook.com/sayed.taqui if want.
  7. Hi, I created a drop-drown menu which is working fine however I m not able to add one effect.When a visitor click on a tab, I want that tab to remain active(colored), so that they may know , on which page they are.For instance like in this site: http://geekyminds.com/ Thanks in advance. Here is the code -------------------------------------------------------------------------------------------------------------------------------------------------- <!DOCTYPE html><html><head><style>.nav ul {list-style:none;margin:0px;padding:0px;}.nav li {float:left;width:100px;background-color:#003;height:32px;position:relative;top:10px;left:0px;text-align:center;border-right:1px solid white;border-top:1px solid white;line-height:32px;}.nav li ul li{float:none;text-align:left;padding-left:5px;background: rgb(0, 0, 0);background: rgba(0, 0, 0, 0.1);}.nav li ul li a{color:#000;}.nav li ul{visibility:hidden;position:absolute;top:22px;left:0px;}.nav ul a{text-decoration:none;color:#FFF;}.nav ul li:hover{background-color:#A72940;}.nav li:hover ul{visibility:visible;}.nav li ul li ul{margin-left:-106px;}</style><body><div class="nav"><ul><li><a href="#">Home</a></li><li><a href="#">About Us</a></li><li><a href="#">Products</a><ul><li><a href="#">Product 1</a><ul><li>Sub Items 1</li><li>Sub Item 2</li><li>Sub Item 2</li></ul></li><li><a href="#">Product 2</a></li><li><a href="#">Product 3</a></li></ul></li><li><a href="#">Contact Us</a></li></ul></div></body></html>
  8. Hi, I was modifying the drop-down menu and got stuck at one point. I want to change the hover color of the sub-menu to pink( The same tab color) however its picking up the border-backgournd color which is blue(#C39). Any help?Thanks in advance. ------------------------------------------------------------------------------------------------------------------------------------------------------------------ Here is the code------------------------------------------------------ <!DOCTYPE html><html><head> <style> #cssmenu{border:1px solid;border-radius:5px;height:40px;margin:20px auto;padding:0px;display:block;width:400px; } #cssmenu>ul{list-style:inside none;padding:0px;margin:0px; } #cssmenu > ul > li{list-style:inside none;float:right;display:block;position:relative;padding:0px;margin:0px; } #cssmenu>ul>li>a{ouline:none;display:block;position:relative;margin:9px 20px;padding:12px 20px;text-align:center;text-decoration:none;font:bold 16px/100% Arial, Helvetica, sans-serif; text-shadow:1px 1px 0 rgba(0,0,0, 0.4);color:#FFF;margin:-4px;} #cssmenu > ul > li:first-child > a{border-radius:5px 0 0 5px;} }#cssmenu ul li.has-sub:hover > a:after{top:0; bottom:0;} #cssmenu ul li.has-sub:hover > a{ background: #C39; border-color:#FFF; padding-bottom:13px; padding-top:13px; top:-1px; z-index:999; } #cssmenu ul li.has-sub:hover > ul, #cssmenu ul li.has-sub:hover > div{display:block;} #cssmenu ul li.has-sub > a:hover{background:#C39; border-color:#FFF;} #cssmenu ul li > ul, #cssmenu ul li > div{ display:none; width:auto; position:absolute; top:38px; padding:10px 0; background: #CCC; border-radius:0 0 5px 5px; z-index:999; } #cssmenu ul li > ul{width:200px;} #cssmenu ul li > ul li{display:block; list-style:inside none; padding:0; margin:0; position:relative;} #cssmenu ul li > ul li a{ outline:none; display:block; position:relative; margin:0; padding:8px 20px; font:10pt Arial, Helvetica, sans-serif; color: #FFF; text-decoration:none; text-shadow } /*Border color*/#cssmenu, #cssmenu > ul > li > ul > li a:hover{ background: #003; } #cssmenu{border-color:#647306;} /*border color ends here*/ #cssmenu > ul > li > a:after{border-color;#FFF;} #cssmenu > ul > li > a:hover{background: #C39;} </style></head> <body> <div id='cssmenu'><ul><li class='active '><a href='index.html'><span>Contact us</span></a></li><li class='has-sub '><a href='#'><span>Products</span></a><ul><li><a href='#'><span>Product 1</span></a></li><li><a href='#'><span>Product 2</span></a></li></ul></li><li><a href='#'><span>About Us</span></a></li><li><a href='#'><span>Home</span></a></li></ul></div> </body></html>
  9. I m creating a page for my practice and got stuck at one place here is the coding --------------------------------------…------------------------------------------------------------------------------<!Doctype><html><head><link rel="stylesheet" type="text/css" href="style.css" /></head><body><h1><strong>YouTube Video</strong></h1><iframe width="500" height="300" autoplay="autoplay" src="http://www.youtube.com/embed/lhcKo7… frameborder="100" allowfullscreen></iframe><div class="center"><p>This video has been stolen from youtube and basically everything has been stolen from one place or the other so dont try to find sense in this page. It is only for my practice purposes. These Icons are also good for nothing and do not relate with the video in any way</p></div><h2>This is image gallarey</h2><p><strong><em>All images are aligned properly and they look like a gallery however the images are stolen from google images.</strong></em></p><img class="photos" src="http://mintywhite.com/images/wg/090… width="111" height="111"><img class="photos" src="https://upload.wikimedia.org/wikipe… width="111" height="111"><img class="photos" src="http://upload.wikimedia.org/wikiped… width="111" height="111"><p class="sec"><em><strong>Second Row</em></strong></p><img class="photos" src="http://cdn1.iconfinder.com/data/ico… width="111" height="111"><img class="photos" src="http://aux4.iconpedia.net/uploads/9… height="111" width="111"><img class="photos" src="http://webbiquity.com/wp-content/up… width="111" height="111"></body></html>--------------------------------------------------------------------------------------…-And the external Style sheet:--------------------------------------------------------------------------------------------------------.photos{float:left;height:90px;width:110px;margin:30px;}h2{color:green;text-weight:bold;font-family:times;}.sec{clear:both;margin-bottom:2px;}iframe{position:relative;padding:0px;top:10px;left:120px;border:5px groove orange;}h1{position:relative;top:10px;left:220px;color:green;.center{margin:auto;width:70%;background-color:#b0e0e6;}--------------------------------------…I m trying to make the text below the video look like this http://www.w3schools.com/css/tryit.asp?f… however its not working. I added that in style by the name of "center"Can somebody please tell me what mistake I m making.
×
×
  • Create New...