7 replies [Last post]
bigeba8
bigeba8's picture
Offline
Regular
gaithersburg MD
Last seen: 8 years 26 weeks ago
gaithersburg MD
Timezone: GMT+2
Joined: 2012-06-10
Posts: 23
Points: 27

I think it might be something with the html rather than the css. Let me know your thoughts.

atarsales.com

The services page ul li won't display right

Thanks in advance

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 day 5 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Hi bigeba8, If you float an

Hi bigeba8,
If you float an element and don't give it a width it get's a width based on what it contains.
Since in this case it contains block level elements, that have no width and aren't floated, it will take up the whole horizontal area available.

Set a width on .simpleCart_shelfItem

bigeba8
bigeba8's picture
Offline
Regular
gaithersburg MD
Last seen: 8 years 26 weeks ago
gaithersburg MD
Timezone: GMT+2
Joined: 2012-06-10
Posts: 23
Points: 27

Still no go

div simpleCart_shelfItem is a java class though? it's not there for css purposes... I added #simpleCart_shelfItem{width:145px;} and it didn't take...ideas?

bigeba8
bigeba8's picture
Offline
Regular
gaithersburg MD
Last seen: 8 years 26 weeks ago
gaithersburg MD
Timezone: GMT+2
Joined: 2012-06-10
Posts: 23
Points: 27

tweaked it

You've been such great help you have no idea how much I appreciate this.

I read what you advised a few times. Wasn't sure how to approach the div class="simpleCart_shelfItem" and add width to it. Well, I tried but it didn't take since it refers to the java class like I wrote earlier. After reading what you wrote a few times I figured why not float it left and give it a width like you were saying. Tell me what you think about it now? Is it not the smarter way of doing it? I want to know the Proper way not the get around it way.

Thanks again!

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 day 5 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

That's a fine solution, as

That's a fine solution, as long as you don't have any content within that wants to exceed the width.

Well done.

What I meant before was:

.simpleCart_shelfItem{
  width:145px;
}

Either way is fine, it is always good to give anything you float a width, so stay with your option.

bigeba8
bigeba8's picture
Offline
Regular
gaithersburg MD
Last seen: 8 years 26 weeks ago
gaithersburg MD
Timezone: GMT+2
Joined: 2012-06-10
Posts: 23
Points: 27

Last question I promise

Big smile you're awesome!

On the services page still. The text "All packages include: blah blah blah" should come after the li. How can I make that happen?

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 day 5 hours ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5343
Points: 2964

Ok you are ready for the

Ok you are ready for the master class Smile
This is a common problem, just a little hard to get your head around at first.
I have some reading for you to do:

Then add a class to the cart div:

<div id="cart" class="cf">

and in your stylesheet add:
.cf:before,
.cf:after {
  content:".";
  display:table;
  height: 0;
  font-size:0; 
  line-height:0;   
  visibility:hidden;
}
.cf:after {
  clear:both;
}
/* For IE 6/7 (trigger hasLayout) */
.cf {
  *zoom:1;
}

bigeba8
bigeba8's picture
Offline
Regular
gaithersburg MD
Last seen: 8 years 26 weeks ago
gaithersburg MD
Timezone: GMT+2
Joined: 2012-06-10
Posts: 23
Points: 27

I wish

I've made everything work perfectly with the help of your code Smile

First time i'm actually completely clueless is to what it does. Read all three of the articles you referenced. Might be out of my league still?
Hopefully one day. I love web stuff I wish I was better with the graphics and all of that. My site still seems kind of plane/boring. Anyways, all your help and tips have been so much help. Thanks a bunch! Until my next problem Wink