text on image...

admin

Administrator
Staff member
I have a problem...

I have an image (200px height and 700px width) and I want to put text in the middle of the image. The text is 100px height and 600px width.
The problem is that I have a lot(!) of text so there's got to be a scrollbar. Is it posibble to have a scrollbar on the image and scroll the text like I'm trying to do?

Thanks!?I dont know if i picked you up right but what about using overflow:auto; on a div so theres a scroll bar.What it does?
I'm not fimiliar with that.Hi -
Basically, make your div and use css styles to give it the background image you want & size you need.

Within, have a paragraph with a lot more content than its set width and height as done with styles:

p#scroll{
width:500px; height:90px; overflow:scroll; padding:8px; background:transparent none;
margin:0 auto; . . .}

You can really position it anywhere you want after that - yeah, more css.

Good luck,
ElI got it wrong I guess...

here's the code:


<div style="width: 740px; height:200px; padding-bottom: 6px; background: url("imgs/main.jpg);">
<p stye="scroll {width:500px; height:90px; overflow:scroll; padding:8px; background:transparent none; margin:0 auto;}">
dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd
dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd
</p>
</div>


I can't see the image on the background as well...<div style="width: 740px; height:200px; padding-bottom: 6px; background: url("imgs/main.jpg);">
<p stye="scroll {width:500px; height:90px; overflow:scroll; padding:8px; background:transparent none; margin:0 auto;}">
dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd
dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd lds;k dsdsds dsd
</p>
</div>


put the quotations in the url. you only have the first one url("imgs/main.jpg)


<p stye="scroll {dkflasdfjkadsl;fjkl;gj

should be <p style="width: 500px; height: 90px; overflow: auto; padding: 8px; background-color: transparent; margin: 0px;">dsfsdflks;dajfklas;dfjklsda</p>why's that?

Here's the new code:

<div style="width: 740px; height:200px; padding-bottom: 6px; background-image: url("imgs/main.jpg")">
<p style="width:500px; height:180px; color: #ffffff; overflow:scroll; padding:8px; background:transparent none;">
dsd lds;k dsdsds dsd lds;k d dsd lds;k dsdsds dsd lds;k d dsd lds;k dsdsds dsd lds;k d dsd lds;k dsdsds dsd lds;k d
</p>
</div>


Is it posible to get rid of the horizontal scroller?

Thanks!overflow: auto;that I can't see the image... why's that?

<div style="background-image: url("imgs/main.jpg"); width: 740px; height:200px; padding-bottom: 6px;">
<p style="width: 720px; height: 180px; font-size: 12px; color: #ffffff; overflow: auto; padding: 8px; background: transparent none;">
dsd lds;k dsdsds dsd lds;k d dsd lds;k dsdsds
</p>
</div>I'm not sure but in your <p> get rid of the background: I don't think that just background: will help. Try background-color: or just get rid of it.




my site
<!-- w --><a class="postlink" href="http://www.madddidley.comwhy?Take">www.madddidley.comwhy?Take</a><!-- w --> the quotation marks out of this ive never had the background work with them there. background-image: url(imgs/main.jpg);

That should work:)!
 
Back
Top