Jump to content


  • Content count

  • Joined

  • Last visited

Community Reputation

0 Neutral

About keytoner

  • Rank
  1. How do I place an image outside the body content?

    THANK YOU VERY MUCH Ingolme! Next time you find a hammer, hit me in the head with it! Somehow you seem to be able to make things "back to the basics"! ,but I seem to be able to get things "over-confused" Thank you again! JD
  2. Hello, I am very confused. I have messed around with HTML and CSS but never understood it. I am trying to now. I am trying to learn from a book called MURACH's HTML and CSS3. I cannot figure out how to place an image outside of the content. Here is what I am trying to explain. This is the result of the html and styles.... the page Here is the CSS ... article, aside, figure, footer, header, nav, section { display: block; } html { background-image: -moz-linear-gradient(top, white 0%, #facd8a 100%); background-image: -webkit-linear-gradient(top, white 0%, #facd8a 100%); background-image: -o-linear-gradient(top, white 0%, #facd8a 100%); background-image: linear-gradient(top, white 0%, #facd8a 100%); } body { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 87.5%; width: 600px; background-color: white; margin: 15px auto; padding: 15px 25px; border: 1px solid black; -moz-border-radius: 25px; border-radius: 25px; -webkit-box-shadow: 5px 5px 0 0; -moz-box-shadow: 5px 5px 0 0; box-shadow: 5px 5px 0 0; } h1 { font-size: 200%; } h2 { font-size: 125%; } h1, h2, p { margin: 0; padding: 0; } a { font-weight: bold; } a:link { color: green; } a:visited { color: #ef9c00; } a:hover { color: blue; } ul { margin: 0 0 1.5em; padding-left: 2em; } li { padding-bottom: 0.25em; } p { padding: 0.25em 0; } em { font-weight: bold; } /* the styles for the header */ header { padding-bottom: 2em; border-bottom: 2px solid #ef9c00; } header img { float: left; } header h1 { color: #ef9c00; text-align: center; text-shadow: 2px 3px 0 black; margin-bottom: 0.25em; } header h2 { color: green; font-style: italic; text-align: center; } /* the styles for the section */ section { clear: left; } section h1 { font-size: 200%; margin: 1em 0 0.35em; } #contact_us { margin-top: 1em; } a.date_passed { color: gray; } /* the styles for the footer */ footer { margin-top: 2em; border-top: 2px solid #ef9c00; padding-top: 0.7em; } footer p { font-size: 80%; text-align: right; } and here is the html..... <!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <title>San Joaquin Valley Town Hall</title> <link rel="shortcut icon" href="images/favicon.ico"> <link rel="stylesheet" href="styles/main3.css"> <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script> </head> <body> <header> <img src="images/logo.jpg" alt="Town Hall Logo" width="80"> <hgroup> <h1>San Joaquin Valley Town Hall</h1> <h2>Bringing cutting-edge speakers to the valley</h2> </hgroup> </header> <section> <h1>2011-2012 guest speakers</h1> <nav> <ul> <li>October 19, 2011: <a class="date_passed" href="speakers/toobin.html">Jeffrey Toobin</a></li> <li>November 16, 2011: <a class="date_passed" href="speakers/sorkin.html">Andrew Ross Sorkin</a></li> <li>January 18, 2012: <a href="speakers/chua.html">Amy Chua</a></li> <li>February 15, 2012: <a href="speakers/sampson.html">Scott Sampson</a></li> <li>March 21, 2012: <a href="speakers/eire.html">Carlos Eire</a></li> <li>April 18, 2012: <a href="speakers/tynan.html">Ronan Tynan</a></li> </ul> </nav> <h2>Looking for a unique gift?</h2> <p>Town Hall has the answer. For only $100, you can get a book of tickets for all of the remaining speakers. And the bargain includes a second book of tickets for a companion.</p> <p class="indent">Or, for $50, you can give yourself the gift of our speakers, and still get an extra ticket for a companion, but for just one of the events.</p> <p class="indent">See you at the next show?</p> <p id="contact_us"><em>Contact us by phone</em> at (559) 555-1212 for ticket information.</p> </section> <footer> <p>&copy; Copyright 2012 San Joaquin Valley Town Hall.</p> </footer> </body> </html> I want to be able to place an image on either side of the main content, and I just can't figure out how. If anyone would clue me in, I will be forever indebted!
  3. How to make buttons "fixed" against scrolling

    Thanks a million Ingolme! Simple for you, but for some reason it passed over my head. It works perfectly, almost. The buttons moved from the top left to bottom right with a border around them. I'll have to scrutinize the external css sheet and see if I can figure out the conflict; But the buttons are fixed! Thank you (it's not the first time you've help me see the "forest thru the trees)
  4. Hi everyone, I haven't here for awhile and I'm not sure I'm in the right forum. might need to be in css I have two buttons that scroll along with the page, I want them to remain "fixed", as it will be a very long page and I need the buttons to always be visible no matter how far down the viewer scrolls. If anyone can guide me to where I can learn how to do this, I would be immensely grateful. Thank you John oops! sorry, I forgot to put in some of the coding: <script> jQuery(function(){ // on DOM load menu1 = new sidetogglemenu({ // initialize first menu example id: 'togglemenu1', marginoffset: 10, downarrowsrc: 'toggledown.png' }) menu2 = new sidetogglemenu({ // initialize second menu example id: 'togglemenu2', position: 'right', source: 'togglemenu.txt', revealamt: -5 }) }) </script> </head> <body> <button onClick="menu1.toggle();" class="sideviewtoggle">Toggle Menu 1</button> <button onClick="menu2.toggle()" class="sideviewtoggle">Toggle Menu 2</button>
  5. Thanks, justsomeguy You and dsonesuk have pointed me in the right direction, thank you very much! JDG
  6. Thanks very much, I am realizing that I "over-complicate" things sometimes. JDG
  7. Hello, this seems like a dumb question... but I want to be able to send an e-mail with an image being a "link". I can't figure out how to do it, text is simple, but an image is different! I'm sure it is simple to you, but I just don't where to find out how to do it. I don't want anyone to do it for me, I just really could use some guidance. Thank you very much if anyone can point me in the right direction! Also, I apologize if I posted this in the wrong place. Thank you, John Gann