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

    Text moving around depending on page size.

    My coding is below. I am really annoyed with this issue. My content to the left with all the links is fine. However the content that says hello is not. When I resize the page the content moves up and left. How can I make it to stay where I put it!!!!
    PLEASE HELP




    [coding]
    <html>

    <head>
    <title></title>
    <style type ="text/css">
    html {height:100%;}
    body {
    margin:0;
    padding:0;
    height:100%;
    background-color:#669966;
    background-image:url("");
    }






    #wrap {
    background:url(http://i1218.photobucket.com/albums/.../Untitled5.png) repeat-y;
    min-height:100%;
    width:630px;
    margin:auto;
    position:relative;
    }



    #left {
    float:left;
    width:200px;
    text-align:center;
    }
    #main {
    position:relative;
    margin-left:500px;
    }





    p, td
    {font-family: Century Gothic;
    font-size: 11px;
    font-weight: 500;
    color: #FFFFCC;text-decoration: none;}



    b
    {font-size: 12px;
    text-decoration: bold;
    margin: 0px;
    font-weight: 600;
    color: #CC3333;
    text-align: left;}

    i
    {color: #333333;
    font-style: italic;}

    u
    {text-decoration: underline;
    color: #000000;
    font-size: 11px;
    }


    s
    {text-decoration:line-through;
    colour: #333333;
    font-size: 12px;
    }




    A:link {text-decoration: none; color: #CC3333}
    A:visited {text-decoration: none;color: #CC3333}
    A:active {text-decoration: none;color: #CC3333}
    A:hover {text-decoration: line-through; color: black;}


    h1
    {
    font-size:19px;
    line-height:18px;
    text-align:right;
    background-color: #999966;
    border-bottom: 1px dotted #CC3333;
    color:#333333;
    font-family:Century Gothic;
    text-decoration: none;}

    h2
    {
    font-size:12px;
    line-height:13px;
    text-align:right;
    background-color: #339900;
    border-bottom: 1px dashed #333333;
    border-top: 1px dashed #333333;
    color:#000000;
    font-family:Century Gothic;
    text-decoration: none;}

    h3
    {
    font-size:10px;
    line-height:11px;
    text-align:left;
    background-color:#;
    border-bottom: 1px dashed #CC3333;
    color:#000000;
    font-family:Arial;
    text-decoration: none;}






    </style>

    </head>

    <body>
    <LINK rel="stylesheet" type="text/css" href="files/no_underline.css">

    <center>
    <img src=http://i1218.photobucket.com/albums/dd406/LhaA/Camera-1.png?t=1303834085 border=1
    >
    </center>

    <div id="wrap">
    <div style="position: relative; top:0px; left:0px; width:145px; height:600px; overflow:auto; float:left;"><p>
    <h2>Heading</h2>
    <h3><a href="URL">LINK</a></h3>
    <br>
    <h2>Heading</h2>
    <h3><a href="URL">LINK</a></h3>
    <h3><a href="URL">LINK</a></h3>
    <h3><a href="URL">LINK</a></h3>
    <br>
    <h2>Heading</h2>
    <h3><a href="URL">LINK</a></h3>
    <h3><a href="URL">LINK</a></h3>
    <h3><a href="URL">LINK</a></h3>
    <br>
    <h2>Heading</h2>
    <h3><a href="URL">LINK</a></h3>
    <h3><a href="URL">LINK</a></h3>
    <h3><a href="URL">LINK</a></h3>
    <br>
    <br>
    <i>Graphics and Coding by Lou.</i> <u>Don't steal </u>
    </p>
    </div>
    </div>


    <div id="wrap">
    <div style="position: relative; top:0px; width:465px; height:600px; left: 165px; overflow:auto; float:main; ;"><p>
    <h1>Hello</h1>
    </p>
    </div>
    </div>

    </body>
    </html>
    [coding]

  • #2
    Senior Coder
    Join Date
    Aug 2010
    Location
    High Point, NC
    Posts
    3,338
    Thanks
    5
    Thanked 363 Times in 360 Posts
    Why use heading tags to wrap ALL your links in?/

    Have a look at unordered lists.

    But to your problem I would suggest you validate your mark-up. As it is now it contains a few errors.
    Last edited by teedoff; 04-27-2011 at 06:50 PM.
    Teed


  •  

    Tags for this Thread

    Posting Permissions

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