Jump to content


  • Content Count

  • Joined

  • Last visited

Everything posted by vmars316

  1. Thanks; I thought I would try global variables . <script type='text/javascript' > var NewLink = "New Link" var TextParagraph = "Text Paragraph" var ArticleHeading = "Article Heading" </script> <script id="js" contenteditable > function createNewLink() { var li_nl = document.createElement("li"); li_nl.innerHTML = NewLink; alert(' function createNewLink = ' + NewLink); li_nl.setAttribute("contenteditable", "true"); var nav = document.getElementById("nav"); nav.appendChild(li_nl); } &
  2. Hello & Thanks : Here is my code: <script id="js" contenteditable > function createArticleHeader(text= "Article Heading") { var p_ah = document.createElement('p'); alert{"p_ah"}; p_ah.innerHTML = text; p_ah.setAttribute('contenteditable', 'true'); var content = document.getElementById('content'); content.appendChild(p_ah); } createArticleHeader("Article Header"); </script> This code runs great, without the alert . But when I add the alert{} line , it doesn't run at all . Is alert{} in the wrong place or what ? Thanks for your help .
  3. Thanks Funce Wow Thank you very much ! It works great ! http://vmars.us/ShowMe/DIY-Html-Master-WIP-01.html I have a lot more to do , but you jump started me . I will Post the final version here later. Thanks
  4. Thanks; "Your text is 'undefined' due to the fact you call CreateTextArea() without any arguments. Which means the text variable is undefined." Sorry , I don't understand what you mean. Pls , explain further. The other errors , I'm working on them. Thanks
  5. Thanks BILU KUMAR SAU : Plenty interesting . Sorry , I should have specified , pure js only . At this point I would rather not tackle learning jquery . Thanks
  6. Hello & Thanks , I have been away from coding a while: I'm having trouble connecting css html and js . Problem areas are: p, ah { font-size: 2em; color: #ffdddd; } p, tgh { font-size: 1em; color: #ddffdd; } and <div id="wrapper"> <section id="section"> <div id="content"> <div class="innertube"> <p contenteditable id="ah" >Article Heading</p> <p contenteditable id="tgh">Text goes here:</p> <p>
  7. THanks Funce , This is useful : https://www.w3schools.com/tags/default.asp . This is useful too : https://www.w3.org/TR/CSS2/propidx.html But the one I am looking for Lists the element "table", then shows what properties are valid for that element "same table" . I am thinking it was on w3schools .
  8. Oops , I posted the wrong code , Here is the correct one" <!DOCTYPE html> <html><head> <title>OneRowTwoCells-ALL.html</title> <meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>DivsOnlyTemplate</title> <!-- DivsOnlyFullTemplateEmpty.html https://www.dummies.com/web-design-development/css3/using-the-div-tag-to-create-tables/ https://htmlformatter.com/ --> <style type="text/css"> .Table
  9. Hello & Thanks , Seems to me that I once saw a chart of Html elements showing the allowable properties and values and inheritances of each element . Anyone know where this is located ? Ugh ! I forgot to bookmark it . Thanks
  10. hanks All ; Looks like this is as close as I am going to get . <!DOCTYPE html> <html> <head> <style> body { margin: 0; } ul { list-style-type: none; margin: 0; padding: 0; width: 15%; background-color: #D3DDEB; text-align: center; position: fixed; height: 85%; border-style: solid; border-color: #5A697D; border-width: 1px; overflow: auto; } li a { display: block; color: #000; padding: 8px 16px; text-decoration: none; } li a.active { background-color: #4CAF50; color:
  11. Thanks Funce , I'll try the fixed position , and the overflow:hidden on my stack of rows and cells . I just realized that I am confusing myself because I am working on two different web pages . I was hoping I could use the same coding for both . One page as the image above where each row and cell is a block (a stack of rows and cells ) . The other page , each cell is an inline-block , which will not work with overflow-hidden . In fact overflow-hidden won't even show rows with inline-block s , or any rows or cells that follow an inline-block row . I don
  12. Aha , this looks promising : https://www.w3schools.com/css/css_navbar.asp Kind of the inverse of what I was thinking ,. Here , the side menu stays still , while the main window scrolls , a full-height, "sticky" verticle side navigation bar . Are these terms reserved words , or are they just an agreed upon standard : header , nav , sidenav , footer , etc.. ? Thanks
  13. Hello & Thanks , Using this example , https://www.w3schools.com/css/tryit.asp?filename=trycss_max-width I was trying to make an 'inline-block' element act like a 'block' (top <div>) . I don't know the name for that , i.e. when I manually decrease the width of the browser window , I want the 'inline-block' 'cell' to stay 'inline' , not pop down on the next line . But no such luck . Eventually (long time and many trials) , I tried the 'display: flex' option on the 'row' containing the 'cell' in question . Surprise surprise , it worked .
  14. Ugh ! Thanks dsonesuk , Sorry , I missed that .
  15. Hello & Thanks , I am having trouble giving a <div> a background color : <div class="Cell" style="width: 25%; border-style: solid; border-color: #FF0000; background-color: D3DDEB; display: inline-block; padding-left: 5px; padding-right: 5px; "> I am using this example: https://www.w3schools.com/htmL/tryit.asp?filename=tryhtml5_migrate_7 I am using inline style= , when I get proper results , then I will transpose code into css styles . <!DOCTYPE html> <html lang="en"> <head> <title>HTML5</title> <
  16. Thanks dsonesuk , I tried it on several browsers Only Tor showed Buttons with underline as part of Button value . But I couldn't quite make the connection . Thanks a:link {text-decoration: none;}
  17. Hello & Thanks , In the code below , I am getting an extraneous "_" underscore after each "Button" . Pls , how can I avoid this ? Thanks <!DOCTYPE html> <html> <head> <title>Previous-Next-Buttons-NoCss</title> <meta name="viewport" content="width=device-width, initial-scale=1"> </head> <body> <h2>Previous-Next-Buttons-NoCss-W3invision.html</h2> <p style="text-align:center"> <br> <br> <a href="Previous-Next-Buttons-NoCss-01.html"> <input type="button" value="Previous-Next-But
  18. Thank you very much ! End of problem .
  19. However , this works fine : td.VaTop { vertical-align: top; } Now , how do I get rid of all that space at the bottom ? Thanks
  20. Also tried : <!DOCTYPE html> <html lang="en"> <head> <title>Divs & Blocks</title> <style> .button{ background-color: #282A36; border: none; color: #C8982B; color: #D9B04E; text-align: center; text-decoration: none; display: inline-block; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; font-family: "Comic Sans MS", cursive, sans-serif ; font-size: 24px; cursor: pointer; } span.RedTxt{ color: red; } table.center { margin-right:auto;
  21. For example : table.center { margin-top:1px; margin-right:auto; margin-left:auto; } table { border: 8px solid #D9B04E; width: auto; height: auto; } td,tr .MarginTop { margin-top:1px; } <table class="center" style="text-align: left; height:100vh;"> <tbody> <tr class="MarginTop"> <td class="MarginTop" > <img src="Arms-1.png" alt="SmileyFace.png"> <br><br>
  22. Thanks , I understand what you are saying But actually I have put in may hours trying all sorts of things with margins . I was hopeful that margin-top:1px; would do the trick , but nogo . Also tried Divs and Blocks . But haven't gotten the results I am after . So my last post is the best I came up with . So I'll keep trying . Thanks
  23. https://validator.w3.org/nu/#textarea Thanks , no errors now . This is the closest I can get so far . Still table 1 has too much space at top and bottom . Can you help me out here . Thanks <!DOCTYPE html> <html lang="en"> <head> <title>Table spacing problem</title> <style> .button{ background-color: #282A36; border: none; color: #C8982B; color: #D9B04E; text-align: center; text-decoration: none; display: inline-block; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black; font-famil
  24. This works for the 2nd <td> But for 1st <td> there is 200px of space of the bottom . td { padding-top: 5px; padding-right: 5px; padding-left: 5px; padding-bottom: 5px; vertical-align: top; } so right now code looks like: <!DOCTYPE html> <html> <head> <style> .button{ background-color: #282A36; border: none; color: #C8982B; color: #D9B04E; text-align: center; text-decoration: none; display: inline-block; text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
  25. When I use this: td { padding-top: 5px; padding-right: 5px; padding-left: 5px; padding-bottom: 5px; } The right and left padding works fine but top and bottom padding don't work . Still need help Thanks
  • Create New...