NineChime forum

Furry stuff, oekaki stuff, and other stuff.

You are not logged in.

#1 12-25-2008 19:08:45

Twighlight
Member

basic coding help

i  know that isnt the place to put this but googling didnt help.
also, my other topic is still active.

ok, i have myh image that i want for my notice. the program i used, blogFUSE, is no  longer in service. i was wondering if someone could help me. i wanna add transparent text bxes over this image
http://i338.photobucket.com/albums/n418 … nner-6.png
i want to add them in the lightest colored boxes.

im really sorry to post this here but as ive said, this is my last resort, and im not too god at coding, but im learning.
can anyone help me?

Offline

#2 12-25-2008 23:07:04

Waccoon
Administrator

Re: basic coding help

Here's a starting point for your notice:

Code:

<style type="text/css">
    #noticebox {
        margin: auto;

        /* -- MAKE WIDTH/HEIGHT THE SAME AS YOUR IMAGE */
        width: 600px;
        height: 200px;
        background-image: url("templates/background.jpg");
    }
    #noticetext {
        width: 300px;

        /* -- CENTER TEXT WITH "margin: auto". */
        /* -- USE MARGIN OR MARGIN-LEFT, NOT BOTH! */
        margin: auto;
        /* margin-left: 100px; */

        /* CHANGES TOP SPACING */
        padding-top: 50px;

        /* CENTERS TEXT */
        text-align: center;

        /* -- BORDER HELPS WITH SIZING WIDTH (NOT HEIGHT) */
        /* border-width: 1px; */
        /* border-color: red; */
        /* border-style: solid; */
    }
</style>


<!-- Notice box -->
<div id="noticebox">
    <div id="noticetext">
        Put your content in here
    </div>
</div>

You'll need to hard code all the widths to make things position correctly, and if you want anything centered properly.

The /* and */ markers declare comments, so any code that appears in those markers will be ignored.  The border styling, for example, should be un-commented if you want to fine-tune the position of the noticetext.  Comment it out again when you are done.

Offline

#3 12-26-2008 18:16:16

Twighlight
Member

Re: basic coding help

oh, i tried your coding and all went smooth until i tried adding the third box and it didnt want to be positioned right...

Offline

#4 12-27-2008 04:17:28

Waccoon
Administrator

Re: basic coding help

Getting more than one box in there will require either floats or relative positioning, and that's pretty advanced.  A table might work, but the position might be different in each web browser.

Offline

Board footer

Yep, still running PunBB
© Copyright 2002–2008 PunBB