News: When asking for support, it helps us and you, if you read the Posting Guidelines

Login  |  Register
HTML5 Icon HTML5 Icon HTML5 Icon
TP on Social Media
Welcome, Guest. Please login or register.
Did you miss your activation email?

November 22, 2019, 06:41:12 AM

Login with username, password and session length

Recent

Members
Stats
  • Total Posts: 189262
  • Total Topics: 20773
  • Online Today: 60
  • Online Ever: 629
  • (November 08, 2018, 01:36:54 PM)
Users Online
Users: 0
Guests: 52
Total: 52

Author Topic: Need some help with this CSS  (Read 2691 times)

0 Members and 1 Guest are viewing this topic.

akulion

  • Guest
Need some help with this CSS
« on: January 11, 2007, 03:26:39 AM »
Hi guys,

Im just putting the final touches on the Pirates theme and wanted some help on one part of the CSS

For the Quote and Code parts I have specified a header image to be used....

However I want this image to be Right Aligned in the header cell since it uses a gradient on the left end merging the colors with the background color (62472a)

Code: [Select]
/* The "Quote:" and "Code:" header parts... */
.quoteheader
{
color: #ffffff;
background: url(images/quote_bg.gif) #62472a no-repeat;
text-decoration: none;
font-style: normal;
font-weight: bold;
font-size: x-small;
line-height: 5.2em;
}
.codeheader
{
color: #ffffff;
background: url(images/code_bg.gif) #62472a no-repeat;
text-decoration: none;
font-style: normal;
font-weight: bold;
font-size: x-small;
line-height: 5.2em;
}

Is there a way for me to align the image to the right or even to set its width?

If u are using 1024 x 786 res u will see what I am trying to do ... at smaller or larger res the header gets messed up: Preview here
Thanks
Aku
« Last Edit: January 11, 2007, 03:28:21 AM by Aku »

ianus

  • Guest
Re: Need some help with this CSS
« Reply #1 on: January 11, 2007, 04:53:54 AM »
Greetings!

I’m glad to give some help back!

Try this:
Code: [Select]
background-image: url(images/code_bg.gif);
background-repeat: no-repeat;
background-position: right;
background-color: #614629;

I copied your image to my localhost and try this code. It work for me, so I think, this solution is correct.
The
background-color: #614629;
fits your image, but you can try
background-color: transparent;
because #614629; isn't a websave color.

Have a lot fun and success with everything you do

Edit
Maybe you could use a smaller image for backgrounds for posts?
It look very stretched and the load time is huge.

Is there an copywrite for the “open letter” image beside the “Code”?
« Last Edit: January 11, 2007, 05:05:45 AM by ianus »

akulion

  • Guest
Re: Need some help with this CSS
« Reply #2 on: January 11, 2007, 07:56:05 AM »
Thanks that worked perfectly!!

That scroll I think I got from war craft site and modified it - had to cut it out of a bigger image.

feel free to use

ianus

  • Guest
Re: Need some help with this CSS
« Reply #3 on: January 11, 2007, 01:25:58 PM »
Greetings!

I am glad to hear that it works. CSS and images are evil. Your theme is really unique and your work also.
It’s an great pleasure for me, to offer my help.

In general, I make my own images. I ask out of sheer curiosity.