helpneeded22
-
Posts
14 -
Joined
-
Last visited
helpneeded22's Achievements
Newbie (1/7)
0
Reputation
-
I am trying to convert the example given here, to a stylesheet: https://www.w3schools.com/css/tryit.asp?filename=trycss_navbar_horizontal_black_fixed2 (By does not work, I mean = does not position at bottom, bullets are displayed when they shouldn't be, backgrounds are not as set, etc.) When I do, it does not work. Can someone please tell me what I am doing wrong. Here is the code I am using. HTML sheet: <!DOCTYPE html> <html> <head> <style> body {margin:0;} </style> <link type="text/css" rel="stylesheet" href="menutest.css"> </head> <body> <ul class="menus"> <li class="menus"><a class="active" href="#home">Home</a></li> <li class="menus"><a href="#news">News</a></li> <li class="menus"><a href="#contact">Contact</a></li> <li class="menus"><a href="#about">About</a></li> </ul> <div style="padding:20px;background-color:#1abc9c;height:1500px;"> <h1>Fixed Bottom Navigation Bar</h1> <h2>Scroll this page to see the effect</h2> <h2>The navigation bar will stay at the bottom of the page while scrolling</h2> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> <p>Some text some text some text some text..</p> </div> </body> </html> And here is the stylesheet: .menus ul { list-style-type: none; margin: 0; padding: 0; overflow: hidden; background-color: #333; position: fixed; bottom: 0; width: 100%; } .menus li { float: left; } .menus li a { display: block; color: white; text-align: center; padding: 14px 16px; text-decoration: none; } .menus li a:hover:not(.active) { background-color: #111; } .menus:active { background-color: #4CAF50; }
-
I have a webpage which I frequently update which also has several images which I frequently replace. (Some of the image names stay the same, but the image is changed). I want to ensure that everytime someone connects to the webpage that they are getting the most recent version of it, and the most recent images. I don't want it to pull anything from the user's cache. To achieve this I have tried the following code: <meta http-equiv="cache-control" content="no-cache"> In IE, the page itself will reload, but the images won't always update... yet sometimes they do. In Chrome, it doesn't work at all. Any suggestions?
-
I have a webpage that is just written in html and javascript. It's a gallery based website, and I often change the images. People often remark that they are not always seeing the newest images. I believe this is just a browser setting issue, as their browser may just be referencing a page from recent history rather than downloading a new one. I would instead, like the page to auto-fresh when someone connects to the page so that they are always seeing the latest version of the page, without them having to manually refresh. What would be the best way to do this?
-
Ah yes, the "t" was the missing link Thanks for your help.
-
<div class="fbtexttile"> <A HREF="https://www.facebook.com/minisgallery/"> Like us on Facebook to get updates on new additions to the galleries! </A> </div> Thanks Foxy, I tried using this but it did not work. I wasn't sure whether I was supposed to put that on my .css page or on my .html page within the <head> -- so I did both, but neither worked. Maybe its the code I am using to reference it?
-
.fbtexttile { width: 130px; float: left; text-align: justify; color: black; font-family: Calibri, Arial, Helvetica, sans-serif; font-size: 12px; font-weight: bold; font-style: normal; padding-top: 2px; padding-right: 2px; } I can't figure out how to remove underlines from a:link text in only a specific div. (It is only the text displayed in this div that I want to be formatted this way -- for all other a:links on my page, I want them to be underlined.) Above is the code I have for the div. What do I add into this code to change all the links (link, hover, visit, active) to be all formatted the same? Thank you.
-
I removed "float: left" from .promoboximage and it appears to work. I thought all elements in nested DIV's had to be floated, but I guess not.
-
To help simplify the code, here are all the elements: <!DOCTYPE html> <html> <head> <style> .promoframe { width: 400px; height: 416px; border-width: 3px; border-color: #808080; /* Gray - Main Frame Border */ border-style: solid; margin: 0 auto; text-align: center; background: white; /* White - Main Frame Background */ } .promoboximage { width: 320px; height: 320px; background: white; float: left; padding-top: 6px; margin: 0 auto; text-align: center; display: inline-block } </style> </head> <body> <div class="promoframe"> <div class="promoboximage"> <img border="1" width="100%" height="100%" align="middle" src="http://www.minisgallery.com/dnd/dnd5/dnd5_treant.jpg" alt=""> </div> </div> </body> </html> I have added a few different things which should work, but still do not. Any ideas?
-
I have an IMG that just refuses to center. At the bottom of the following page, you will see an image called "Treant". It will not center in the DIV. http://www.minisgallery.com/dnd/dnd5.htm The container code is: .promoframe { width: 400px; height: 416px; border-width: 3px; border-color: #808080; /* Gray - Main Frame Border */ border-style: solid; display: block; margin: 0 auto; text-align: center; background: white; /* White - Main Frame Background */ } The image DIV code is: .promoboximage { width: 320px; height: 320px; background: white; float: left; padding-top: 6px; display: inline-block; } The Javascript/HTML which references this: document.write('<img border="0" width="100%" height="100%" src="http://www.minisgallery.com/dnd/' + galleryname + promomini[8] + '.jpg" alt="">'); //Image Does anyone have any ideas why this is not working?
-
I have tried several different experiments, but each time I try to set only the bottom and top border widths, they instead affect the left and right. Does anyone know why this might be? I want the top and bottom border of a div to be 3px. In addition to the code below, I have also tried: border: 3px 0px solid black; <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title>Modern5e</title> <style type="text/css"> .titleband { width: 100%; height: auto; margin-top: 10px; text-align: center; background: #930000; border-style: solid; border-color: black; border-left: 3px; border-right: 3px; } </style> </head> <body background="iron.jpg"> <div class="titleband"><img src="modern5e_logo4.gif"></div> </body> </html>
-
I am trying to update my HTML knowledge as quite a lot I have learned in the past has been depreciated. In the past when I wanted to insert blank lines I would use: <p> </p> and </ br> Is there a better way to do this now?
-
I think I have it working now. I noted that the "elseif" should be "else if". When I deleted the lines with "else if" it still failed to function with the "else" condition. When I remove the "else" then it all works.
-
I am brand new to Javascript, but I do have some programming experience. My code is not working and the only reason I can think of is that JS must not be able to evaluate an array in an IF statement? Here is a sample code: <script type="text/javascript"> var mini01=["AMIRI","Rare","Medium","on","Announced","July 7, 2012"];var rarecolor="#000000";if (mini01[1]=="Common") { rarecolor="#008000"; } elseif (mini01[1]=="Uncommon") { rarecolor="#0000ff"; } else { rarecolor="#ffffff"; }document.write('<font color="' + rarecolor +'">');document.write(mini01[1]); </script> Nothing outputs. Any suggestions? (Note: I do close the FONT tag in html after the script)