Welcome to WebmasterWorld Guest from

Forum Moderators: not2easy

Message Too Old, No Replies

<div class="text"> not showing in browsers but showing in lynx

Having trouble with pulling text across image



8:58 am on Aug 22, 2012 (gmt 0)

5+ Year Member

Hi i was trying to pull the text across the images via css using
<div class="text"> which i've placed right after the image. it doesn't show in browsers but it does show up in the lynx browser.
If i apply this method, can it be considered a spammy technique ?
I'm just dipping my feet in css.


11:25 am on Aug 22, 2012 (gmt 0)

WebmasterWorld Senior Member lucy24 is a WebmasterWorld Top Contributor of All Time Top Contributors Of The Month

You'll need to start by explaining what div.text is ;)

By "put the text across the images" do you mean, use an image as the background for text? Nothing wrong with that, so long as humans can read it.


2:49 pm on Aug 22, 2012 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

Hi bicycling, and to approach this in another way, I'm not not sure I understand exactly what your goals are. so that makes it challenging to make suggestions.

Are you wanting the text in the div to display for visual users? If so, is it possible to set the image as a background-image as Lucy refers? I would also ask if a page <div>ision is required as this sounds more like a sentence/paragraph. A snippet of the html and relevant css would help decide if there is a more appropriate element.

If you don't want the text to display for visual users, what is the purpose of the text? For example, if you are trying to load key words then it is spammy and you answered your own question! If the text is intended to assist non-visual users or those with images turned off, then a div still sounds more than required - can you deliver the information using the alt=" " attribute, or a link to a long description, for example.


4:21 am on Aug 23, 2012 (gmt 0)

5+ Year Member

sorry for being unclear.
Yes as you all would have guessed, my intention was to set the image as background and hover the text over the image. i.e: opera.com

however i am already running a slider CSS script to auto rotate 3 pictures which has text as jpg.

therefore i wanted to try to addon div text to pull the text over the pictures instead of using text as image.

i've added the div text within the slider css script, and the text which i've tried to call out doesn't show up in all the browsers. however when i tried view source or use a text browser like lynx, the text shows right after the images.

wanted to put this live, but afraid that it was deemed spammy as the usual browsers doesn't show the text but in view source & lynx browser it shows.

i guess it would be risky :)


8:00 am on Aug 23, 2012 (gmt 0)

WebmasterWorld Senior Member lucy24 is a WebmasterWorld Top Contributor of All Time Top Contributors Of The Month

You can't link to the site, but you can and should post the relevant bits of code. Don't know about other people, but when there are images involved I run up a quick grey rectangle and park it where the html can find it.


8:26 am on Aug 23, 2012 (gmt 0)

5+ Year Member

Hi Lucy here is the code, hope it makes sense

<a href="http://www.example.com/a"><img src="a.jpg"></a> <br>
<div class="text">
<div itemprop="description" itemscope itemtype="http://schema.org/Product">
<p><span itemprop="description">Text sentence for a.jpg to come across</span></p></div></li> <br>
<li><a href="http://www.example.com/b"><img src="b.jpg"></a>
<div class="text">
<div itemprop="description" itemscope itemtype="http://schema.org/Solutions">
<p><span itemprop="description">Text sentence for b.jpg to come across</span></p></div>

those in bold doesn't appear in common browsers, but shows up in lynx.


8:41 am on Aug 23, 2012 (gmt 0)

WebmasterWorld Senior Member 5+ Year Member

Hi bicycling,

Thanks for the clarification. As I understand it, you are not asking for help to get the text to show in visual user agents (like browsers) you are asking whether going live with the text not visible will be deemed spammy. As I said above, that will depend on what the text says. Massive keyword stuffing is spam and depending on the quantity, may be penalised.

My second thought is that if you intended the text to be visible for visual users, and it isn't, it is just wasted bandwidth: Removing it solves the whole issue.

My final thought is that if you originally wanted the text to be visible for visual users, then what about trying to get the code to perform as desired? Text is so much better as text than as an image (unless there is some other reason an image is necessary) and it should not be difficult. However, as Lucy says, we need some code because there are a number of ways to do this.

If you want to look yourself, start by checking whether the "slider" script is loading the images into divs, then using either display/visibility or z-index to switch them around. The div you inserted to hold your text may be inheriting the styles so it remains hidden.


8:52 am on Aug 23, 2012 (gmt 0)

5+ Year Member

Hi thanks for the replies, though the text is exactly the same as per in the image, i understand that it might be considered spam not worth the risk. just wanted to apply this which is much quicker than tinkering with CSS further. will do away with it,until i'm good enough to get the css done up properly for the desired text effect.

thanks all.

Featured Threads

Hot Threads This Week

Hot Threads This Month