Hello and welcome to our community! Is this your first visit?
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 3 of 3
  1. #1
    New to the CF scene
    Join Date
    Dec 2007
    Thanked 0 Times in 0 Posts

    Help placing a form with CSS/HTML (Complete Beginner)

    Hey I just started putting together a site. I'm using a template that I found and making my own modifications. I understand CSS/HTML on a very basic level and I need help placing a form in a specific location. I've included the HTML file and CSS file, and also a screenshot of where I'd like the form. I would REALLY appreciate any help you're willing to offer. Thanks in advance.

    Attached Files Attached Files

  2. #2
    Senior Coder ahallicks's Avatar
    Join Date
    May 2006
    Lancaster, UK
    Thanked 57 Times in 55 Posts
    Not complete at all, but might help you get underway

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
    <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en">
    <script type="text/javascript" language="javascript" src="lytebox.js"></script>
    <link rel="stylesheet" href="lytebox.css" type="text/css" media="screen" />
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    <meta name="description" content="your description goes here" />
    <meta name="keywords" content="your,keywords,goes,here" />
    <meta name="author" content="Your Name / Original design: Andreas Viklund - http://andreasviklund.com/" />
    <link rel="stylesheet" type="text/css" href="andreas05.css" />
    <div id="title"><h1>HOME</h1></div>
    <div id="container">
    <div id="sidebar">
    <a class="menu" href="home.html">home</a>
    <a class="menu" href="gallery.html">gallery</a>
    <a class="menu" href="#">upload</a>
    <a class="menu" href="contact.html">contact</a>
    <a class="menu2" href="#">login/signup</a></div>
    <div id="main">
    <h2>andreas05 - the simple solution!</h2>
    <a href="images/image-1.jpg" rel="lytebox"><img src="images/thumb-1.jpg" width="100" height="40" alt="" /></a>
    <p>Sometimes, the simple things are the most beautiful. This design was made with simplicity in mind, to make it quick and easy to edit the code and get your website online. The amount of code is very small, and the layout is very basic. No visual effects, no advanced features, just a very simple template.</p>
    <p><strong>Note:</strong> If you don't like the dragon (which was made using a freeware font named "Tattoo"), you can easily replace it with an image of your own!</p>
    <h2>An open source design!</h2>
    <p>This design is released as open source, which means that you can make any changes you may want to, and use the page in any way you want to as long as you give the proper credits to the original author. Have fun! If you want more designs to choose from, you can visit <a href="http://andreasviklund.com/">my website</a> where you can download more <a href="http://andreasviklund.com/templates/">templates</a> by me.</p>
    <p class="credits"><a href="home.html" title="menu">home</a>|<a href="gallery.html" title="menu">gallery</a>|<a href="#" title="menu">upload</a>|<a href="contact.html" title="menu">contact</a><br />
    <p class="credits"><strong>&copy; 2007 Tim Horn</strong> and <strong>Thomas Carey</strong>
    <div id="footer"></div>
    /* andreas05 - an open source xhtml/css website layout by Andreas Viklund - http://andreasviklund.com/ . Free to use for any purpose as long as the proper credits are given for the original design work.
    Version: 2.0, July 15, 2006 */
    /* General tags */
    *{margin:0; padding:0;}
    body{background:#ccc url(images/bodybg.gif) repeat; font:76&#37; verdana,tahoma,sans-serif;}
    a{background-color:inherit; color:#286ea0; font-weight:bold; text-decoration:none;}
    p{margin:0 0 16px 0;}
    ul, ol{margin:0 0 16px 15px; padding-left:5px;}
    ul ul, ol ol{margin:3px 0 0 15px;}
    img{float:left; margin:0 10px 5px 0;}
    /* Headers */
    h1{color:#555; font-size:3.6em; letter-spacing:-3px; margin:0; text-align:right;}
    h2{font-size:1.6em; font-weight:normal; letter-spacing:-1px; margin:5px 0 10px;}
    /* IDs */
    #title{margin:20px auto -9px; width:700px;}
    #container{background:#fff url(images/front.png) bottom left no-repeat; border:20px solid #555; color:#555; margin:0 auto 15px; padding:10px; width:700px; line-height:1.3em;}
    #sidebar{float:left; padding-left:175px; width:110px; position: relative; min-height:350px}
    * html #sidebar {height: 350px;}
    #sidebar p{margin:10px 0 5px 0; text-align:center; font-size:0.8em;}
    #login{float:left; padding-left:175px; padding-top:175; width:110px}
    #main{float:right; width:385px;}
    /* Menu */
    .menu{border:1px solid #ffffff; color:#286ea0; display:block; font-size:1.1em; font-weight:bold; padding:4px 2px 4px 10px; width:110px;}
    .menu2{border: 1px solid #ffffff; color:#ff7700; display:block; font-size:1.1em; font-weight:bold; padding:4px 2px 4px 10px; width:110px;}
    .menu:hover{background-color:#f8f8f8; border:1px solid #dadada; color:#286ea0; text-decoration:none;}
    .menu2:hover{background-color:#f8f8f8; border:1px solid #dadada; color:#ff7700; text-decoration:none;}
    /* Various classes */
    .hidden {display:none; visibility:hidden;}
    .credits{color:#888; font-size:0.9em; margin-bottom:0;text-align:center;}
    .credits a{color:#888;}
    /* The Form */
    form#yourform {
    	position: absolute;
    	bottom: 0px;
    "write it for FireFox then hack it for IE."
    Quote Originally Posted by Mhtml View Post
    Domains are like women - all the good ones are taken unless you want one from some foreign country.
    Reputation is your friend

    Development & SEO Tools

  3. #3
    The Apostate Apostropartheid's Avatar
    Join Date
    Oct 2007
    Thanked 265 Times in 263 Posts
    <meta http-equiv="content-type" content="text/html; charset=ISO-8859-1" />
    XHTML 1.1 may not be served with the text/html MIME type--use application/xhtml+xml or application/xml instead. Not that any browsers will recognize this, mind; you'll have to change the HTTP header for it to work effectively. All in all, just use XHTML 1.0 Strict instead.


Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts