[quote=fasterthanlightā¢;2348963].my_list {
list-style-type:none;
[COLOR=Red]padding:0;[/COLOR]
}[/quote]
Oops, forgot that! Good catch. :lol: :bounce:
[quote=fasterthanlightā¢;2348963].my_list {
list-style-type:none;
[COLOR=Red]padding:0;[/COLOR]
}[/quote]
Oops, forgot that! Good catch. :lol: :bounce:
Just as some friendly advice, you really should consider brightening your text. It is unreadable on a CRT (methinks you design on an lcd). I seriously had to highlight your text with the mouse to see that it was just filler gibberish.
ok, ive been playing around with it and itās OK now. One problem though, the text doesnāt show up. Why not?
actually itās not OK. Itās shunted about 10px to the right.
Well one problem is you wrapped the <span class=āmoreā> around the <h4> and <p> so your margins are performing double timeā¦
if your going to wrap the span around them then change your css to thisā¦
.my_list li h4,
.my_list li p {
[COLOR=Red]/* remove the margin-left that was here */[/COLOR]
font-size: 80%;
line-height: 1.5em;
color: #444;
}
.more {
display: block;
[COLOR=Red]margin-left: 455px;[/COLOR]
border: 1px solid #101010;
height: 300px;
padding: 10px;
font-size: 80%;
line-height: 1.5em;
color: #444;
}
[COLOR=Red][COLOR=Black]*take out the margin-left from the h4 and p and subtract 10px from the .more one
Although Iām not fully understanding what you want to accomplish, do you want the box with the gray border flush against the image or 10px to the right of the image?
[/COLOR] [/COLOR]
10px to the right.
What about the text not showing up?
It is showing up its just WAAAAAAY to the right and [SIZE=1]really small[/SIZE]ā¦ the problem is you have your HTML like this:
<span class="more">
<h4></h4>
<p></p>
</span>
and your CSS states:
.my_list li h4,
.my_list li p {
font-size: 80%;
line-height: 1.5em;
[COLOR=Red]margin-left: 465px;[/COLOR]
color: #444;
}
.more {
display: block;
[COLOR=Red]margin-left: 465px;[/COLOR]
border: 1px solid #101010;
height: 300px;
padding: 10px;
font-size: 80%;
line-height: 1.5em;
color: #444;
}
ā¦so your margins are doubling up. So to fix it get rid of the margin-left on the first css statement and the text will be there.
itās just shunted 10px to the right now, thatās the only problem.
[QUOTE=redelite;2349001]do you want the box with the gray border flush against the image or 10px to the right of the image?
[/QUOTE]
[QUOTE=Timmytots;2349009]10px to the right. [/QUOTE]
Isnāt that what you wanted when asked? :h:
.my_list li {
clear: both;
display: block;
[COLOR=Red]padding[/COLOR][COLOR=Red]: 0;[/COLOR]
width: 736px;
}
The padding on the LI is causing it, change it to 0 instead of 10. :thumb2:
lol, good catch lunatic
and timmi, you shouldnāt wrap block level elements with inline elements like span
span should go INSIDE <h4> and <p>
also, www.getfirebug.com
Think heās now talking about the entire block is 10px [COLOR=Red]right[/COLOR], not the space between them.
*Edit: I need to go back to kindergardenā¦
I still think you should replace <span class=āmoreā> with a div,
and wrap your image with a div
[quote=fasterthanlightā¢;2349040]I still think you should replace <span class=āmoreā> with a div,
and wrap your image with a div[/quote]
+1, Originally there wasnāt a div and the span was the āView Moreā text link, but instead he wrapped the <h4> and <p> in it so I just went with it to fix it. He could easily change it since hes using just a class to define the block (.more).
But I agree with faster, you should use a <div> instead of a <span>.
Ahhhh, I see. Wish I knew CSS.
now thereās no space vertically between the images and text of image1 and 2. shall i put margin-bottom: 10px; in the my_list li?
Are we building a website for TimmyTots?
No, weāre (well, not really me) helping him with a spacing problem he is having.
Pay attention!
yep, itās perfect now. Thanks for all your help guys. Sorry to be dumb.
No problem, GO TEAM! Later homeslice! :thumb2:
:: Copyright KIRUPA 2024 //--