Ads 468x60px

Pages

Monday, March 31, 2008

Scroll box for putting long URL, large photos, scripts containing long unbroken lines

I have previously published posts regarding scroll box (click BACK button to get back to this page):

How to make a scroll box

Scroll box for images like photos, screen shots, etc

Scroll box for Label List

Scroll box FAQ

I am not sure if this is mentioned in the above posts, but what I have done is to save a Notepad file with different attributes to fit the width of the main column and also, to save me the bother of having to edit the script for the scroll box each time I need one with different height, I just have in the Notepad file with different heights to fit the more frequent occurrences, and inside the scroll box below is the content of the Notepad file I used:


<div style="width: 395px; height: 200px; background-color: ffffff; color: ffffc0; font-family: arial black; font-size: 10px; text-align: left; border: 1px solid 000000; overflow: auto; padding: 4px;"></div>

--------------------------

<div style="width: 395px; height: 400px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;"></div>

--------------------------

<div style="width: 395px; height: 100px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;"></div>

<div style="width: 395px; height: 30px; background-color: a0ffff; color: 000000; font-family: arial; font-size: 12px; text-align: left; border: 0px solid 00000; overflow: auto; padding: 4px;"></div>


Note that the width in the above was set to fit the width of the main column (posts) of my main blogs and you will of course have to use different values for different templates. For this, refer to How to find the width of the Header, sidebars and main column (click BACK button to get back to this page).

Now a blogger complained about the background color changing each time she edit a post. Now I am no CSS (Cascading Style Sheets), not being an IT person, but I would hazard a guess that she should look for some pseudo-elements in the template for <div> that may look something like the below:

div:background-color {color:#ff0000;font-size:xx-large}

and change the code for the color to whatever she wants. Note that this is only a guess, and if you happen to get a similar problem and have tried to solve it, your feedback by leaving a comment will be highly appreciated.


Peter Chen's nice graphic signature

0 comments:

Post a Comment