TalkPHP
 
 
Account Login
Latest Articles
» The basic usage of PHPTAL, a XML/XHTML template library for PHP
» Vulnerable methods and the areas they are commonly trusted in.
» Simple way to protect a form from bot
» The Basics On: How Session Stealing Works
» How to keep your forms from double posting data
IRC Channel
IRC Speech Bubble Join the friendly bunch on IRC...
(#TalkPHP on Freenode)

...Also available via a web interface.

See this thread for information on the TalkPHP Free Hugs Initiative™. Subject to availability.
Associates
Associates
CSS Tutorials
Reply
 
LinkBack Thread Tools Search this Thread Display Modes
Old 12-29-2011, 07:16 PM   #1 (permalink)
The Acquainted
 
captainmerton's Avatar
 
Join Date: May 2009
Posts: 178
Thanks: 9
captainmerton is on a distinguished road
Default Background image using CSS

Using the following css:

PHP Code:
#usermessage {float:left; width:100%; margin-bottom:25px; padding:10px; font-weight:bold; background: #CCFFFF; border: 1px solid #99CCFF;
background-image:url('images/lightbulb.png');background-repeat:no-repeat;background-position:left;} 
At the moment if i add text to the usermessage div it starts over the lightbulb image. Anybody got any advice on the neatest way to start the text after the lightbulb background image without adding spaces to the text in the html or creating lots of divs to slice up the message?

Cheers.
captainmerton is offline  
Reply With Quote
Old 12-30-2011, 05:38 PM   #2 (permalink)
The Addict
 
tony's Avatar
 
Join Date: Aug 2008
Posts: 336
Thanks: 8
tony is on a distinguished road
Default

so you want the background to be moved? you can use background-position with coordinates, like background-position: 50% 50%; that would center the background in the div.
tony is offline  
Reply With Quote
Old 01-02-2012, 03:46 PM   #3 (permalink)
The Acquainted
 
captainmerton's Avatar
 
Join Date: May 2009
Posts: 178
Thanks: 9
captainmerton is on a distinguished road
Default

Thanks Tony. I have used that to better position it but it still sits behind the words. Its a help text area so i want a small lightbulb image to appear then text to follow the image at the moment the text overwrites the lighhtbulb image perhaps setting it in the stylesheet isnt the way to go? I could just display th image then the text in the html but feels like the wrong thing to do. Any guidance?

Cheers,
Ewan
captainmerton is offline  
Reply With Quote
Old 01-04-2012, 04:13 PM   #4 (permalink)
The Addict
 
tony's Avatar
 
Join Date: Aug 2008
Posts: 336
Thanks: 8
tony is on a distinguished road
Default

Ok so you want to space out the text in the text area so that it is not over the background image. I am not sure, but I think text-indent works well with textareas (in my experience it doesn't work well with some elements) I haven't done css in months.
tony is offline  
Reply With Quote
Old 01-04-2012, 06:44 PM   #5 (permalink)
The Acquainted
 
captainmerton's Avatar
 
Join Date: May 2009
Posts: 178
Thanks: 9
captainmerton is on a distinguished road
Default

Thanks Tony will give it a try.
captainmerton is offline  
Reply With Quote
Reply



Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
 
Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

vB code is On
Smilies are On
[IMG] code is On
HTML code is Off
Trackbacks are On
Pingbacks are On
Refbacks are On

Similar Threads
Thread Thread Starter Forum Replies Last Post
Image Reflections in PHP Rendair Advanced PHP Programming 17 11-30-2011 08:41 AM
Create a new transparent image? danceRobot Absolute Beginners 1 08-19-2010 05:57 PM
Cropping Background Image for Most Resolutions aquastream XHTML, HTML, CSS 3 03-08-2010 07:16 PM
Dynamicly place text on a background image ReSpawN Advanced PHP Programming 2 04-26-2008 09:37 PM
Simple GD Code For Text With A Background Image. Alex.Prisoner Advanced PHP Programming 1 01-05-2008 11:27 PM


All times are GMT. The time now is 10:30 PM.

 
     

Powered by vBulletin® Version 3.6.8
Copyright ©2000 - 2013, Jelsoft Enterprises Ltd.
Search Engine Optimization by vBSEO 3.1.0
Inactive Reminders By Icora Web Design