• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 568
  • Last Modified:

HTML code help

Trying to place text in lower right hand corner of my page.


Have to links Contact Us and Guest Book
Want to make them buttons and place them in lower right corner

The color not working either

New to this thanks


<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />

		<title>Tom's Music Site</title>

		<meta name="viewport" content="width=device-width; initial-scale=1.0" />

		<style type="text/css">
			body { background:url(images/ilm.jpg) repeat-x; } 
		</style>
	</head>

	<body>
                <font color=#DC143C>
		<h1>This site is down for maintenance</h1>

                <form>
                <input type="button" value="Show All MP3 Songs" onClick="window.location.href='music.asp'">
                </form> 

                <p><!--webbot bot="Timestamp" S-Type="EDITED" S-Format="%m/%d/%Y" startspan -->12/12/2013<!--webbot bot="Timestamp" endspan i-checksum="12626" -->
                </p>
               <p bottom right>             
                <font color=#DC143C> 
                <a href="mailto:webmaster@mydomain.com?subject=User requesting info">
                Contact US</a></p>
                <p bottom right> 
                <font color=#DC143C>  
                <a href="GuestBook.htm">Sign Our GuestBook</a></p>                              
        </body>

</html>

Open in new window

0
Thomas Grassi
Asked:
Thomas Grassi
  • 2
  • 2
1 Solution
 
Nathan RileyFounderCommented:
Here you go.  You needed a div, not a <p>.  Also you needed to set the color on the a href the way you tried to set the font color was incorrect.
<style>
body { background:url(images/ilm.jpg) repeat-x; } 
a{color:#DC143C;}
#bottomright{float:right;}
</style>
		<title>Tom's Music Site</title>



	<body>
                <font color=#DC143C>
		<h1>This site is down for maintenance</h1>

                <form>
                <input type="button" value="Show All MP3 Songs" onClick="window.location.href='music.asp'">
                </form> 

                <p><!--webbot bot="Timestamp" S-Type="EDITED" S-Format="%m/%d/%Y" startspan -->12/12/2013<!--webbot bot="Timestamp" endspan i-checksum="12626" -->
                </p>
                <div id="bottomright">             
                    <a href="mailto:webmaster@mydomain.com?subject=User requesting info">
                    Contact US</a> | <a href="GuestBook.htm">Sign Our GuestBook</a>
                </div>

Open in new window


Here is example of it working:
http://jsfiddle.net/gallitin/8uzbK/
0
 
Thomas GrassiSystems AdministratorAuthor Commented:
Thanks for the fast reply.

I get the same results as you now but they are not on the bottom of the page the are just below the date field but on the right side of the page.

Would like them at the bottom.
0
 
Nathan RileyFounderCommented:
Updated:
http://jsfiddle.net/gallitin/8uzbK/1/

<style>
body { background:url(images/ilm.jpg) repeat-x; } 
a{color:#DC143C;float:right;margin-right:20px;}
#bottomright{float:right;bottom:0;position:fixed;width:100%;}
</style>
		<title>Tom's Music Site</title>



	<body>
                <font color=#DC143C>
		<h1>This site is down for maintenance</h1>

                <form>
                <input type="button" value="Show All MP3 Songs" onClick="window.location.href='music.asp'">
                </form> 

                <p><!--webbot bot="Timestamp" S-Type="EDITED" S-Format="%m/%d/%Y" startspan -->12/12/2013<!--webbot bot="Timestamp" endspan i-checksum="12626" -->
                </p>
                <div id="bottomright">             
                    <a href="mailto:webmaster@mydomain.com?subject=User requesting info">
                    Contact US</a><a href="GuestBook.htm">Sign Our GuestBook</a>
                </div>

Open in new window

0
 
Thomas GrassiSystems AdministratorAuthor Commented:
Thanks so much
0
Question has a verified solution.

Are you are experiencing a similar issue? Get a personalized answer when you ask a related question.

Have a better answer? Share it in a comment.

Join & Write a Comment

Featured Post

Cloud Class® Course: Amazon Web Services - Basic

Are you thinking about creating an Amazon Web Services account for your business? Not sure where to start? In this course you’ll get an overview of the history of AWS and take a tour of their user interface.

  • 2
  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now