Fri, 2010-07-23 18:38
I have some site alignment issues that I think are related to padding, but I can't see where to change to make it work right.
-the footer is pushed down, which is because my above divs are showing as if my padding or divs inside that parent div are too big... not sure why that is happening? I can position the footer with relative positioning but I'd rather fix the problem of the divs blowing down if possible.
-the unordered list of products in the left column is indented too far to the right. I can't see where the padding or what setting might be pushing those li's to the right...
Also, does anyone know how to align an li to lineup middle of the images next to them, as I have in the "It's Easy" area?
This is the site link:
signartonline
Thanks!
Sat, 2010-07-24 07:07
#1
Quote: -the unordered list of
-the unordered list of products in the left column is indented too far to the right. I can't see where the padding or what setting might be pushing those li's to the right...
it's padding - as you mention! Have you tried removing, variously, padding and margin? There are only two elements to experiment with 
Also, does anyone know how to align an li to lineup middle of the images next to them, as I have in the "It's Easy" area?
Firstly if it's a numbered set of steps use a OL list rather than UL
Secondly bullet graphics are generally placed as backgrounds to the LI element then you can use the background position offsets to set the vertical placement to 50%
Sat, 2010-07-24 09:57
#2
Pinago wrote: -the footer is
-the footer is pushed down, which is because my above divs are showing as if my padding or divs inside that parent div are too big... not sure why that is happening? I can position the footer with relative positioning but I'd rather fix the problem of the divs blowing down if possible.
Have you adjusted the width and height of the content div relative to the size of your padding? if you have a massive padding-bottom: 300px; then you will need to change the height of your div down minus 300px, unless of course your div does not have a height value.
Also double check the padding-top and margin-top of your footer.
Luke.
Sat, 2010-07-24 13:58
#3
Thanks
I will check over things some more and try the OL. Thanks!
Sat, 2010-07-24 14:36
#4
padding?
Hi, I don't see "padding-bottom:300px;" in my styles anywhere. Where did you see that, were you just using that as an example or are you referring to the total padding bottom? Thanks!
Sat, 2010-07-24 17:12
#5
Pinago wrote: Hi, I don't see
Hi, I don't see "padding-bottom:300px;" in my styles anywhere. Where did you see that, were you just using that as an example or are you referring to the total padding bottom? Thanks!
That was just an example, I don't think you supplied us with your CSS?.. if you can post your html and css here that would be useful.
Luke.
Sat, 2010-07-24 22:13
#6
site link
sorry, the I thought the css and html were visible in the link to the actual site that I had included. the site link is: Sign art online Thanks
Sun, 2010-07-25 00:02
#7
Pinago wrote: sorry, the I
sorry, the I thought the css and html were visible in the link to the actual site that I had included.
Well, you did give the link in your original post and that is indeed all we need to see your html and your css. But occasionally everyone misses something.
You should be using a STRICT document type, not a transitional one. We've explained why lots of time so I won't repeat that here, being lazy. Even with the transitional doctype the validator flags an unclose P element you should fix - unclosed elements are dangerous when you are writing xhtml, although it probably won't cause a problem in most browsers.
Also the CSS validator flags some problems with your CSS. These might be intentional CSS3 rules which the validator may flag, but if so you should be careful and know why you are doing this. I believe IE just can't handle CSS3 at present, for one thing.
I suggest you switch to a strict document type, fully validate the html to that doctype, and fix those CSS errors unless they were intended.
Mon, 2010-07-26 12:09
#8
thanks
Ed, I'm working through those changes now. The css3 was intentional. Thanks