CSS Margin Center Work in Firefox Not in Chrome

.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}

I want to make a Banner on the bottom the page with fixed position and freeze when scrolled.

.content {

      position: fixed;

      margin: 0% auto;

      left:0;

      right:0;

      bottom:0px;

      z-index: 999999999;

}

<table class="content">

    <tr>

        <td>

            <img src="logo.png">

        </td>

    </tr>

</table>

I use that setting and when did a test in firefox it's work perfectly but not in the Chrome, the banner position is still in the left, not center.

Someone can help me? I just want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center. Thanks

edited Jan 4 at 10:26

Mukyuu

2,13131125

asked Jan 4 at 9:14

benkmad

i think you need to use margin: 0 auto;, the % is unnecessary

– Ramon de Vries
Jan 4 at 9:16

Drop the % sign from your margin.

– Robin Wright
Jan 4 at 9:21

1

Try to use footer if you want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center.

– Mukyuu
Jan 4 at 9:24

I already use margin: 0 auto; but not work. It's will set to center if position: auto; but the banner position will at the end of the page (Not freeze) and the banner not in the front of the page.

– benkmad
Jan 4 at 9:28

add a comment |

I want to make a Banner on the bottom the page with fixed position and freeze when scrolled.

.content {

      position: fixed;

      margin: 0% auto;

      left:0;

      right:0;

      bottom:0px;

      z-index: 999999999;

}

<table class="content">

    <tr>

        <td>

            <img src="logo.png">

        </td>

    </tr>

</table>

I use that setting and when did a test in firefox it's work perfectly but not in the Chrome, the banner position is still in the left, not center.

Someone can help me? I just want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center. Thanks

edited Jan 4 at 10:26

Mukyuu

2,13131125

asked Jan 4 at 9:14

benkmad

i think you need to use margin: 0 auto;, the % is unnecessary

– Ramon de Vries
Jan 4 at 9:16

Drop the % sign from your margin.

– Robin Wright
Jan 4 at 9:21

1

Try to use footer if you want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center.

– Mukyuu
Jan 4 at 9:24

I already use margin: 0 auto; but not work. It's will set to center if position: auto; but the banner position will at the end of the page (Not freeze) and the banner not in the front of the page.

– benkmad
Jan 4 at 9:28

add a comment |

I want to make a Banner on the bottom the page with fixed position and freeze when scrolled.

.content {

      position: fixed;

      margin: 0% auto;

      left:0;

      right:0;

      bottom:0px;

      z-index: 999999999;

}

<table class="content">

    <tr>

        <td>

            <img src="logo.png">

        </td>

    </tr>

</table>

I use that setting and when did a test in firefox it's work perfectly but not in the Chrome, the banner position is still in the left, not center.

Someone can help me? I just want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center. Thanks

edited Jan 4 at 10:26

Mukyuu

2,13131125

asked Jan 4 at 9:14

benkmad

I want to make a Banner on the bottom the page with fixed position and freeze when scrolled.

.content {

      position: fixed;

      margin: 0% auto;

      left:0;

      right:0;

      bottom:0px;

      z-index: 999999999;

}

<table class="content">

    <tr>

        <td>

            <img src="logo.png">

        </td>

    </tr>

</table>

I use that setting and when did a test in firefox it's work perfectly but not in the Chrome, the banner position is still in the left, not center.

Someone can help me? I just want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center. Thanks

.content {

      position: fixed;

      margin: 0% auto;

      left:0;

      right:0;

      bottom:0px;

      z-index: 999999999;

}

<table class="content">

    <tr>

        <td>

            <img src="logo.png">

        </td>

    </tr>

</table>

.content {

      position: fixed;

      margin: 0% auto;

      left:0;

      right:0;

      bottom:0px;

      z-index: 999999999;

}

<table class="content">

    <tr>

        <td>

            <img src="logo.png">

        </td>

    </tr>

</table>

html css banner

edited Jan 4 at 10:26

Mukyuu

2,13131125

asked Jan 4 at 9:14

benkmad

edited Jan 4 at 10:26

Mukyuu

2,13131125

asked Jan 4 at 9:14

benkmad

edited Jan 4 at 10:26

Mukyuu

2,13131125

edited Jan 4 at 10:26

Mukyuu

2,13131125

edited Jan 4 at 10:26

Mukyuu

2,13131125

asked Jan 4 at 9:14

benkmad

asked Jan 4 at 9:14

benkmad

asked Jan 4 at 9:14

benkmad

i think you need to use margin: 0 auto;, the % is unnecessary

– Ramon de Vries
Jan 4 at 9:16

Drop the % sign from your margin.

– Robin Wright
Jan 4 at 9:21

1

Try to use footer if you want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center.

– Mukyuu
Jan 4 at 9:24

I already use margin: 0 auto; but not work. It's will set to center if position: auto; but the banner position will at the end of the page (Not freeze) and the banner not in the front of the page.

– benkmad
Jan 4 at 9:28

add a comment |

i think you need to use margin: 0 auto;, the % is unnecessary

– Ramon de Vries
Jan 4 at 9:16

Drop the % sign from your margin.

– Robin Wright
Jan 4 at 9:21

1

Try to use footer if you want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center.

– Mukyuu
Jan 4 at 9:24

I already use margin: 0 auto; but not work. It's will set to center if position: auto; but the banner position will at the end of the page (Not freeze) and the banner not in the front of the page.

– benkmad
Jan 4 at 9:28

i think you need to use margin: 0 auto;, the % is unnecessary

– Ramon de Vries
Jan 4 at 9:16

Drop the % sign from your margin.

– Robin Wright
Jan 4 at 9:21

Try to use footer if you want to make a banner in the bottom the page, fixed position(freeze when scrolled), margin-center.

– Mukyuu
Jan 4 at 9:24

I already use margin: 0 auto; but not work. It's will set to center if position: auto; but the banner position will at the end of the page (Not freeze) and the banner not in the front of the page.

– benkmad
Jan 4 at 9:28

add a comment |

1 Answer
1

active

oldest

votes

margin: auto only works if that element has fixed width add width to you table.

you can use below code
I am using div instead of table which is better than table for footer. I have made the div flex and align the content to center.

.content {

    position: fixed;

    margin: 0 auto;

    left:0;

    right:0;

    z-index: 999999999;

    bottom:0px;

    display:flex;

    justify-content:center;

}

<div class="content"> 

  <img src="logo.png">

</div>

answered Jan 4 at 10:19

Xenio Gracias

1,7701512

Thanks.. It's work..

– benkmad
Jan 4 at 12:12

add a comment |

Your Answer

StackExchange.ifUsing("editor", function () {
StackExchange.using("externalEditor", function () {
StackExchange.using("snippets", function () {
StackExchange.snippets.init();
});
});
}, "code-snippets");

StackExchange.ready(function() {
var channelOptions = {
tags: "".split(" "),
id: "1"
};
initTagRenderer("".split(" "), "".split(" "), channelOptions);

StackExchange.using("externalEditor", function() {
// Have to fire editor after snippets, if snippets enabled
if (StackExchange.settings.snippets.snippetsEnabled) {
StackExchange.using("snippets", function() {
createEditor();
});
}
else {
createEditor();
}
});

function createEditor() {
StackExchange.prepareEditor({
heartbeatType: 'answer',
autoActivateHeartbeat: false,
convertImagesToLinks: true,
noModals: true,
showLowRepImageUploadWarning: true,
reputationToPostImages: 10,
bindNavPrevention: true,
postfix: "",
imageUploader: {
brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
allowUrls: true
},
onDemand: true,
discardSelector: ".discard-answer"
,immediatelyShowMarkdownHelp:true
});

}
});

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54035944%2fcss-margin-center-work-in-firefox-not-in-chrome%23new-answer', 'question_page');
}
);

Post as a guest

Name

Required, but never shown

1 Answer
1

active

oldest

votes

1 Answer
1

active

oldest

votes

margin: auto only works if that element has fixed width add width to you table.

you can use below code
I am using div instead of table which is better than table for footer. I have made the div flex and align the content to center.

.content {

    position: fixed;

    margin: 0 auto;

    left:0;

    right:0;

    z-index: 999999999;

    bottom:0px;

    display:flex;

    justify-content:center;

}

<div class="content"> 

  <img src="logo.png">

</div>

answered Jan 4 at 10:19

Xenio Gracias

1,7701512

Thanks.. It's work..

– benkmad
Jan 4 at 12:12

add a comment |

margin: auto only works if that element has fixed width add width to you table.

you can use below code
I am using div instead of table which is better than table for footer. I have made the div flex and align the content to center.

.content {

    position: fixed;

    margin: 0 auto;

    left:0;

    right:0;

    z-index: 999999999;

    bottom:0px;

    display:flex;

    justify-content:center;

}

<div class="content"> 

  <img src="logo.png">

</div>

answered Jan 4 at 10:19

Xenio Gracias

1,7701512

Thanks.. It's work..

– benkmad
Jan 4 at 12:12

add a comment |

margin: auto only works if that element has fixed width add width to you table.

you can use below code
I am using div instead of table which is better than table for footer. I have made the div flex and align the content to center.

.content {

    position: fixed;

    margin: 0 auto;

    left:0;

    right:0;

    z-index: 999999999;

    bottom:0px;

    display:flex;

    justify-content:center;

}

<div class="content"> 

  <img src="logo.png">

</div>

answered Jan 4 at 10:19

Xenio Gracias

1,7701512

margin: auto only works if that element has fixed width add width to you table.

you can use below code
I am using div instead of table which is better than table for footer. I have made the div flex and align the content to center.

.content {

    position: fixed;

    margin: 0 auto;

    left:0;

    right:0;

    z-index: 999999999;

    bottom:0px;

    display:flex;

    justify-content:center;

}

<div class="content"> 

  <img src="logo.png">

</div>

.content {

    position: fixed;

    margin: 0 auto;

    left:0;

    right:0;

    z-index: 999999999;

    bottom:0px;

    display:flex;

    justify-content:center;

}

<div class="content"> 

  <img src="logo.png">

</div>

.content {

    position: fixed;

    margin: 0 auto;

    left:0;

    right:0;

    z-index: 999999999;

    bottom:0px;

    display:flex;

    justify-content:center;

}

<div class="content"> 

  <img src="logo.png">

</div>

answered Jan 4 at 10:19

Xenio Gracias

1,7701512

answered Jan 4 at 10:19

Xenio Gracias

1,7701512

answered Jan 4 at 10:19

Xenio Gracias

1,7701512

answered Jan 4 at 10:19

Xenio Gracias

1,7701512

Thanks.. It's work..

– benkmad
Jan 4 at 12:12

add a comment |

Thanks.. It's work..

– benkmad
Jan 4 at 12:12

Thanks.. It's work..

– benkmad
Jan 4 at 12:12

add a comment |

draft saved

draft discarded

Thanks for contributing an answer to Stack Overflow!

Please be sure to answer the question. Provide details and share your research!

But avoid …

Asking for help, clarification, or responding to other answers.

Making statements based on opinion; back them up with references or personal experience.

To learn more, see our tips on writing great answers.

draft saved

draft discarded

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Sign up or log in

StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});

Post as a guest

Name

Required, but never shown

Name

Required, but never shown

Name

Required, but never shown

This page is only for reference, If you need detailed information, please check here

搜尋此網誌

Bdtjtk