View Full Version : text wont stay inside <li> tag

07-10-2011, 09:57 AM
I have a piece of text that is ment to stay inside a <li> tag. There is an image and an <a> tag inside the <li> as well. I imagine this is pushing the limits on what the <li> is suppose to have in it, but it works so far in FF (please IE be good to me :P)

My only problem is the text wont stay in the <li> when I scroll down. The text stays in the place it initially loaded on the screen. I realize this is being caused by the position: fixed; attribute.

My question is, is there another way to get it to load inside the <li> and stay there? position: fixed was the only way I found so far of getting it there.


<li id="intro_menu_1">
<a href="javascript:void(0);" id="intro_menu_1_a">

<p class="intro_menu_desc" id="intro_menu_1_desc" ><b>Game 1</b><br /><br />Lorem ipsum dolor sit amet,</p>
<img src="images/BMW-E81.png" alt="Intro menu image 1" class="intro_menu_image" id="intro_menu_1_image"/>


.intro_menu li {
display: block;
position: relative;
z-index: 1;

height: 110px;
margin: 40px 0px;

.intro_menu li a
height: 100px;
width: 100%;
float: right;
margin: 0px;
padding: 0px;
line-height: 100px;
text-align: center;
color: #fff;

text-decoration: none;
border-width: 2px 2px 2px 2px;
border-style: solid;
border-color: #666;
background: gray;

position: absolute;
z-index: 2;
height: 120px;
width: 120px;
margin: 10px 5px;



position: fixed;
float: left;
margin: 20px 0px 10px 0px;

I appreciate the help

07-10-2011, 10:17 AM
Plz share full code of your page or link of it,,,,

I ll try to help you out :)