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.
Page 1 of 2 12 LastLast
Results 1 to 15 of 20

Thread: Backgrounds

  1. #1
    New Coder
    Join Date
    Mar 2009
    Posts
    20
    Thanks
    1
    Thanked 0 Times in 0 Posts

    Backgrounds

    Can anyone tell me how to make a simple background (just 1 colour) for a website, with some simple text in the bottom right corner?

    And show me how to make it visible to everone who visits the website, so its not stretched on other users screens ect.
    Last edited by Webbage; 03-12-2009 at 03:22 AM.

  • #2
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    <html><head>
    <style>
    body{
    background-color:black;
    }
    #bottomcorner{

    position: absolute;
    bottom :10px;
    right:10px;
    color:white;
    }
    </style>
    </head>
    <body>
    <div ID="bottomcorner">your text</div>
    </body></html>


    seems to work. Enjoy

  • #3
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    Step right up...Pick a corner... Any corner...
    Code:
    <html><head>
    <style>
    body{
    background-color:black;
    }
    #botrightcorner{
    
    position: absolute;
    bottom :10px;
    right:10px;
    color:white;
    }
    #toprightcorner{
    position: absolute;
    top :10px;
    right:10px;
    color:red;
    }
    #topleftcorner{
    position: absolute;
    top :10px;
    left:10px;
    color:blue;
    }
    #botleftcorner{
    position: absolute;
    bottom :10px;
    left:10px;
    color:green;
    }
    </style>
    </head>
    <body>
    <div ID="botrightcorner">your text</div>
    <div ID="toprightcorner">your text</div>
    <div ID="topleftcorner">your text</div>
    <div ID="botleftcorner">your text</div>
    </body></html>

  • #4
    New Coder
    Join Date
    Mar 2009
    Posts
    20
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Where would I paste that code to?

    Im using XML and Flash....

  • #5
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    you want to edit the index file of your website or simply create a new page and use that code. Put the stuff between the <style></style> tags in the <head></head>
    and put all the <div>words</div> in between the <body></body> tags
    If you want, cut and paste the code above into a notepad file where you can read it and move text around. Next, save it as an name you want plus .html. it will then be an html page. You can then click on it and it will open. upload that html file where you want it and you're all set.


    here's the structure one more time.
    <html>
    <head>
    <style>
    cascading style sheet info
    </style>
    </head>

    <body>
    <div>words</div>
    </body>
    </html>

    if your still stuck, I'll load it to a site where you can link it. Good luck.

  • #6
    New Coder
    Join Date
    Mar 2009
    Posts
    20
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Ahhh I see....

    Right Ive done that, but nothin' show...

    But when I click on refresh, I can see it flicker.

    It kinds to be a different font too, can I change the font and the size?

  • #7
    New Coder
    Join Date
    Mar 2009
    Posts
    20
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Anymore help guys?

  • #8
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    here's page on my site.
    http://h1.ripway.com/tinyscript/testdiv.html
    Save the file to your documents or desktop so you can upload the whole file to your site. Once it's on your site, you can edit it with the edit features. Or you can open a text file on your computer to edit it. Open a new txt file up so it's blank. Then grab and drag the HTML file into the open text file (the big white open file you could be typing text into) and viola!, you'll see the HTML code. edit as needed and then either save it as a new file(so the old file remains the same) with a different name, and this is important, add .html to the file name you choose

    if you don't add .html it will be saved as a txt file

    if you hit save instead of save as , the original file you dragged into the text file to edit will be saved with the changes. Be sure it's correct if you do this. The old working file will be lost if your changes don't work. Keep a back up of the file in case you mess up.


    Good luck, my friend. You can learn this. Be sure to pay attention to the details.


    here's how to do the font changes
    http://www.w3schools.com/css/css_font.asp

    read and test out while you're learning. Each time you are uncertain if what you've done will work, you should save the new changes as a new .html file with a new name. that way if it doesn't work, you can delete it and start editing for a new try again.

  • #9
    New Coder
    Join Date
    Mar 2009
    Posts
    20
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Thanks for your time in helping me, I've tried what you said, but still no luck, I cant see it, but when I refresh my page I can see it flicker on....

    Myabe because the background is flash?

    Would It be possible to speak to you over a IM TinyScript?
    Last edited by Webbage; 03-15-2009 at 09:58 PM.

  • #10
    Regular Coder
    Join Date
    Mar 2009
    Location
    Portland Oregon
    Posts
    690
    Thanks
    44
    Thanked 63 Times in 62 Posts
    Hmm, I'm afraid I don't understand. Can you see text or not? LOL

  • #11
    New Coder
    Join Date
    Mar 2009
    Posts
    20
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Haha

    Right, when I put that code into my index page, nothing shows up.

    But when I refresh the page, and the flash background refreshes, the flash takes a mili second longer, an that give me time to see the bottom right text pop up, but then disapears again because of the flash covering it.

  • #12
    Senior Coder gnomeontherun's Avatar
    Join Date
    Sep 2007
    Location
    Houston
    Posts
    2,846
    Thanks
    10
    Thanked 238 Times in 229 Posts
    Give us a link. I have no idea what your problem is at the moment because you are talking about flash and he is talking about css...

    Also change this in your flash embed code in HTML if you haven't already.

    Quote Originally Posted by Adobe
    Editing HTML code manually

    To edit an existing HTML page, add the WMODE parameters to the HTML code.

    1. Add the following parameter to the OBJECT tag:

    <param name="wmode" value="transparent">

    2. Add the following parameter to the EMBED tag:

    wmode="transparent"
    jeremy - gnomeontherun
    Educated questions often get educated answers, and simple questions often get simple answers.

  • #13
    New Coder
    Join Date
    Mar 2009
    Posts
    20
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Code:
    http://lpentertainment.net/outsourcedjs/new_website/
    Theres a link to the website.

    Basicly what I want is for the words "OUTSOURCE" to be in the bottom right corner, just above the "music player" in a font called "Base 02"

  • #14
    Senior Coder gnomeontherun's Avatar
    Join Date
    Sep 2007
    Location
    Houston
    Posts
    2,846
    Thanks
    10
    Thanked 238 Times in 229 Posts
    Why not add this inside of the flash movie?

    Just type the text with that font, and then you will need to embed the font into Flash.

    http://www.jumpeyecomponents.com/pub...ding_fonts.htm

    This confusion arose because you didn't describe that you were using Flash, which since the whole page is Flash using CSS to do this is not the best solution.
    jeremy - gnomeontherun
    Educated questions often get educated answers, and simple questions often get simple answers.

  • #15
    New Coder
    Join Date
    Mar 2009
    Posts
    20
    Thanks
    1
    Thanked 0 Times in 0 Posts
    Right, I tried that, but when I visit the site, I cant see it at the bottom of the screen, but when I press F11 to make the screen bigger, I can see it.

    It seems to alter on different resolutions.

    Is there a fix for this?


  •  
    Page 1 of 2 12 LastLast

    Posting Permissions

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