[SOLVED] How To Remove Margin/Padding Between Center Column & Footer? (PIC)

[RickieSee]

Hello all.

 

I'm having real dificulty removing this:

 

 

I've disabled right column.

 

Been through the CSS - cant see what's wrong. Any thoughts?

 

Thanks ever so much

[ysco]

Hello RickieSee,

 

Would be a lot easier to post your site link here so that people can help you better for a solution.

 

Regards,

 

ysco..

[Mike Kranzler]

Hi Rickie,

Can you please post your URL so that we can check this out for you?

 

-Mike

[Mike Kranzler]

Looks like ysco beat me to it , but the sentiment is the same. Once you provide us with the URL, I think we can hopefully help you with this pretty quickly and easily.

 

-Mike

[RickieSee]

http://www.partybra.co.uk

 

Let me know what ya think of the design to

[Patric]

Topic moved into the "Integration" section.

[Mike Kranzler]

Hi Rickie,

The design looks good! As for your original question, the element you'll need to edit in the CSS is called "hrline."

 

I hope this helps!

 

-Mike

[RickieSee]

Hi Mike.

 

Thanks for the reply!

 

.hrline {display: block; clear: both; margin: -0.66em 0;

visibility: hidden;}

 

If I change the margin to 0em it actually increases. Im stuck Anything else you can think of? O

 

Thanks

[ysco]

Hello RickieSee

 

Nope it do not fix your problem, i also just try`t that.

 

Do the following,

 

Open Global.css and look for this line #footeredge and at the following,

 

position: relative;
top: -7px;

 

So the whole code look like this,

#footeredge
{
height: 92px;
background-color: #FFF;
background-image: url(../img/bottomedge.jpg);
background-repeat: no-repeat;
background-position: right center;
position: relative;
top: -7px;
}

 

Thats all.

 

ysco..

[RickieSee]

YSCO I LOVE YOU

 

Thanks for the replies you two!

 

Rickie

[Mike Kranzler]

 

If I change the margin to 0em it actually increases. Im stuck Anything else you can think of? O

 

 

In addition to ysco's suggestions, try changing it to -1em. It won't remove it completely, but it will shrink it down to something hopefully more manageable.

 

-Mike

[RickieSee]

Also what do you think of the design/layout if you don't mind.

 

Thanks

[Mike Kranzler]

Looks like he beat me to the punch twice now . Thanks for your suggestions ysco, I'll go ahead and mark this as solved for you.

 

-Mike

[Mike Kranzler]

Also what do you think of the design/layout if you don't mind.

 

Thanks

 

The one thing that jumped out to me immediately is that you're missing prices for most of the products in your slider.

 

-Mike

[RickieSee]

 

The one thing that jumped out to me immediately is that you're missing prices for most of the products in your slider.

 

-Mike

 

Yeah the sites still in dev - need to get that done Thanks Mike

[ysco]

Hello Guys

 

Sorry Mike hehe

I also try your suggestion but if you put it to -1em then it do not looks good as there will be a overlay for some reason.

 

Glad that it worked now for you RickySee, site looks really nice.

 

Regards,

 

ysco..

[Mike Kranzler]

Hello Guys

 

Sorry Mike hehe

I also try your suggestion but if you put it to -1em then it do not looks good as there will be a overlay for some reason.

 

Glad that it worked now for you RickySee, site looks really nice.

 

Regards,

 

ysco..

 

Yes, your solution definitely looks better, and mine doesn't work as well in combination with yours as it does alone. So full credit to you!

 

-Mike

[RickieSee]

If you've got time could you explain to me how it worked please

 

I understood how Mike's solution would work - however ymco's I don't. (yup a noobish)

 

Also do you guys use a webdeveloper plugin for your browser or something, because you were both really fast.

 

Thanks

[Mike Kranzler]

Hi Rickie,

Every browser has its own solution. Running Chrome, all I have to do is right click and select "Inspect Element." In Firefox, you can use Firebug. Those are definitely the two best options, both are very simple to learn and utilize.

 

-Mike

[RickieSee]

Thanks again Mike i'll try that Learn new stuff everyday on here

[ysco]

Hello RickieSee

 

I use sometimes firebug and developer tools plugin for firefox.

But the program that i use the most is stylizer ( this is a paid one ) but is worth every penny.

This is great for all css and you can make the changes online and see the results right away and after your satisfied you can save the new file and upload it right away to your server or save it on your computer.

 

Regards,

 

ysco..

[RickieSee]

Hi guys - could you please please check this again for me?

 

I've been playing around with the footer (and a div and making it 100% width) (not really touching the CSS otherwise) and a similiar thing has happened.

 

Please could you check the site

[Mike Kranzler]

Hi RickieSee,

What is the exact issue you're running into now, relative to earlier?

 

-Mike

[RickieSee]

Hi Mike,

 

Could you check the site: (http://www.partybra.co.uk)

 

The exact same thing has reappeared. I jigged around with the footer to make it 100% and a div to put the info central - however very little css was used.

 

Thanks

[Mike Kranzler]

Hi Rickie,

Did you make any changes to the CSS that ysco suggested? You might want to go in and replace whatever is there currently with the code snippet he posted yesterday, you never know when something might've been accidentally changed without you realizing it.

 

-Mike

[RickieSee]

Hi Mike,

 

Yeah it's there! Nothing's changed. Bummer!

[ysco]

Hello RickieSee

 

Try this,

 

#footer
{
   color: #A6A6A6;
   margin: 0 auto 2px;
   background-image: url(../img/bg_footer.jpg);
   width: 100%;
   padding: 0 0 20px;
   clear: both;
   text-align: left;
   position: relative;
   top: 5px;
}

 

And this,

 

#page
{
   width: 980px;
   /*[disabled]padding:8px 0px;*/
   background: url('../img/fold_top.jpg') no-repeat;
   background-color: #FFF;
   margin: 0px auto;
   text-align: left;
   position: relative;
   top: 8px;
}

 

Let me know if this worked for you

 

Regards,

 

ysco..

[RickieSee]

Hi there!

 

Yeah it did work - however ideally I don't want padding at the top - if you look it gives my logo the effect it's been sliced! What do you think?

[Mike Kranzler]

I agree, it does look a little bit cut off at the top.

 

-Mike

[ysco]

Hello RickieSee,

 

Download the attachment and try it.

There is global.ccs and blocksearch.css.

I have also positioned blocksearch a bit.

 

Test and let me know.

 

ysco..

[RickieSee]

ysco - thanks man - that's solved the problemo! I owe you one

 

if you got time could you tell me what you think of the layout and explain what i missed. thanks again

 

Rickie

[ysco]

Hello RickieSee,

 

Glad this solved your problem.

I just looked at your site, i think it is a very cool looking site and i especially like your top slide module.

You did that yourself ?

I noticed on summary page that a few things are not correct, you have set the page 100% width and most are float left but the shoppingcart block is centered. Looks not good this way i think.

Also it would looks better when the image from 1. accounts and 2. delivery methods and 3. choose payments methode would also have full image width.

 

You also have in global.css on line 1595 "padding: padding: 1em 0 !important;" and does not validate just remove one padding and your done.

 

But further it look really great

 

Regards,

 

ysco..

[RickieSee]

Thanks man!

 

Yeah I did the slider on my own - the whole site is by my own hand - the stuff like the carousel are hardcoded into the header- can't really afford to buy themes etc as I'm a broke student hehe. I'm actually enjoying learning stuff as I go.

 

After ive finished i would like to learn how to make modules and stuff i can put into the admin but my php isn't too good.

 

Once again thank you for your input -

[RickieSee]

Hello again guys - I think something else has occured that went unnoticed - there's no a margin at the bottom of my page - below the white footer.

 

Check it out:

 

 

 

Could you guys please help me again?

 

edit -

 

It's definitley to do with this:

 

#footer

{

color: #A6A6A6;

background-image: url(../img/bg_footer.jpg);

width: 100%;

clear: both;

text-align: left;

position: relative;

top: 5px;

margin-top: 0;

margin-right: auto;

margin-bottom: 0px;

margin-left: auto;

padding-top: 0;

padding-right: 0;

padding-bottom: 20px;

padding-left: 0;

}

 

I play around with that number, and it shifts it up and down. The original problem comes back if i do this (however solves the new one)

If there's no solution I shall make the bottom image white so it blends with the gap - problem kinda solved worst case scenario.

 

One more thing - the site looks fine in Firefox - however I tried it on my friends computer today (IE) and the dropdown menu didnt work - it fades with the slider? There's no css as far as I can tell linking them together Any ideas?

 

Thanks

[ysco]

Hello RickySee,

 

Try the attached global.css and blockcms for the first problem.

 

As for the second problem, it does not work correct with IE7 and lower, i tested in IE8 and IE9 and is working without a problem.

I thought maybe it had something to do with the z-index and i try some changes but no go.

What you can try is to see if your css files are cross-browser compatible, there is a cool online tool that can check and do the changes if needed.

Take a look at this tool http://prefixr.com/index.php

 

Hope this helped a bit.

 

Your site is totally messed up in IE6.

If nothing works then you can also install a module that gives a customer a notification when they visit your site with IE6 or IE7 with a message to update the current browser for a full working website.I think most users have IE8 and IE9 these days.

Do not know the name off the module anymore but i believe there are two version floating on the forum.

 

 

Regards,

 

ysco..

website bra.zip

[RickieSee]

ysco....

 

Thanks for your help man you've been fantastic

 

All seems okay with the site now! I guess with IE6 etc that not many people will be using so i think aslong as it works with ie8 i'm happy!

[ysco]

Hello RickieSee,

 

I'm glad all is sorted now

Yes it is working just fine on IE8 and above, did test it.

Problem only occur when using IE6 and IE7 , the majority these days uses IE8+.

 

Regards,

 

ysco..