How to align bootstrap image center
.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}
0
Align image center. I am using 3.3.7 version of bootstrap. I tried used text-center or style="text-align:center" did not work for me
<div class="row">
<div style="overflow:hidden" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
twitter-bootstrap twitter-bootstrap-3
asked Jan 4 at 18:19
user1030181user1030181
89051232
add a comment |
0
Align image center. I am using 3.3.7 version of bootstrap. I tried used text-center or style="text-align:center" did not work for me
<div class="row">
<div style="overflow:hidden" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
twitter-bootstrap twitter-bootstrap-3
asked Jan 4 at 18:19
user1030181user1030181
89051232
Where do you want to center the image? Into thecolor into therow?
– bep42
Jan 4 at 18:31
I want center of row
– user1030181
Jan 4 at 18:48
add a comment |
0
0
0
Align image center. I am using 3.3.7 version of bootstrap. I tried used text-center or style="text-align:center" did not work for me
<div class="row">
<div style="overflow:hidden" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
twitter-bootstrap twitter-bootstrap-3
asked Jan 4 at 18:19
user1030181user1030181
89051232
Align image center. I am using 3.3.7 version of bootstrap. I tried used text-center or style="text-align:center" did not work for me
<div class="row">
<div style="overflow:hidden" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
twitter-bootstrap twitter-bootstrap-3
twitter-bootstrap twitter-bootstrap-3
asked Jan 4 at 18:19
user1030181user1030181
89051232
asked Jan 4 at 18:19
user1030181user1030181
89051232
asked Jan 4 at 18:19
user1030181user1030181
89051232
asked Jan 4 at 18:19
user1030181user1030181
89051232
asked Jan 4 at 18:19
user1030181user1030181
89051232
89051232
Where do you want to center the image? Into thecolor into therow?
– bep42
Jan 4 at 18:31
I want center of row
– user1030181
Jan 4 at 18:48
add a comment |
Where do you want to center the image? Into thecolor into therow?
– bep42
Jan 4 at 18:31
I want center of row
– user1030181
Jan 4 at 18:48
Where do you want to center the image? Into the
col or into the row ?– bep42
Jan 4 at 18:31
Where do you want to center the image? Into the
col or into the row ?– bep42
Jan 4 at 18:31
I want center of row
– user1030181
Jan 4 at 18:48
I want center of row
– user1030181
Jan 4 at 18:48
add a comment |
3 Answers
3
active
oldest
votes
1
Add 'center-block' to image as class - no additional css needed
<img src="images/default.jpg" class="center-block img-responsive"/>
I tried center block i dont know why its not working
– user1030181
Jan 4 at 18:43
@user1030181 what error are you getting.
– user10866229
Jan 4 at 18:44
No error not aligning on center..no error in console
– user1030181
Jan 4 at 18:49
@user1030181center-blockshould work, not then try my another answer.
– user10866229
Jan 4 at 18:55
add a comment |
0
Try this if looking for inline css solution. add margin:0 auto.
<div class="row">
<div style="overflow:hidden; margin:0 auto;" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
answered Jan 4 at 18:49
Geethanjana NallaperumageGeethanjana Nallaperumage
162
add a comment |
0
Twitter bootstrap has a class that centers: .pagination-centered
It worked for me to do:
<div class="row-fluid">
<div class="span12 pagination-centered"><img src="header.png" alt="header" /></div>
</div>
The css for the class is:
.pagination-centered {
text-align: center;
}
This is not working for big image
– user1030181
Jan 4 at 19:21
I want fit big image inside div
– user1030181
Jan 4 at 20:02
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');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54044167%2fhow-to-align-bootstrap-image-center%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
3 Answers
3
active
oldest
votes
3 Answers
3
active
oldest
votes
active
oldest
votes
active
oldest
votes
1
Add 'center-block' to image as class - no additional css needed
<img src="images/default.jpg" class="center-block img-responsive"/>
I tried center block i dont know why its not working
– user1030181
Jan 4 at 18:43
@user1030181 what error are you getting.
– user10866229
Jan 4 at 18:44
No error not aligning on center..no error in console
– user1030181
Jan 4 at 18:49
@user1030181center-blockshould work, not then try my another answer.
– user10866229
Jan 4 at 18:55
add a comment |
1
Add 'center-block' to image as class - no additional css needed
<img src="images/default.jpg" class="center-block img-responsive"/>
I tried center block i dont know why its not working
– user1030181
Jan 4 at 18:43
@user1030181 what error are you getting.
– user10866229
Jan 4 at 18:44
No error not aligning on center..no error in console
– user1030181
Jan 4 at 18:49
@user1030181center-blockshould work, not then try my another answer.
– user10866229
Jan 4 at 18:55
add a comment |
1
1
1
Add 'center-block' to image as class - no additional css needed
<img src="images/default.jpg" class="center-block img-responsive"/>
Add 'center-block' to image as class - no additional css needed
<img src="images/default.jpg" class="center-block img-responsive"/>
answered Jan 4 at 18:32
user10866229
I tried center block i dont know why its not working
– user1030181
Jan 4 at 18:43
@user1030181 what error are you getting.
– user10866229
Jan 4 at 18:44
No error not aligning on center..no error in console
– user1030181
Jan 4 at 18:49
@user1030181center-blockshould work, not then try my another answer.
– user10866229
Jan 4 at 18:55
add a comment |
I tried center block i dont know why its not working
– user1030181
Jan 4 at 18:43
@user1030181 what error are you getting.
– user10866229
Jan 4 at 18:44
No error not aligning on center..no error in console
– user1030181
Jan 4 at 18:49
@user1030181center-blockshould work, not then try my another answer.
– user10866229
Jan 4 at 18:55
I tried center block i dont know why its not working
– user1030181
Jan 4 at 18:43
I tried center block i dont know why its not working
– user1030181
Jan 4 at 18:43
@user1030181 what error are you getting.
– user10866229
Jan 4 at 18:44
@user1030181 what error are you getting.
– user10866229
Jan 4 at 18:44
No error not aligning on center..no error in console
– user1030181
Jan 4 at 18:49
No error not aligning on center..no error in console
– user1030181
Jan 4 at 18:49
@user1030181
center-block should work, not then try my another answer.– user10866229
Jan 4 at 18:55
@user1030181
center-block should work, not then try my another answer.– user10866229
Jan 4 at 18:55
add a comment |
0
Try this if looking for inline css solution. add margin:0 auto.
<div class="row">
<div style="overflow:hidden; margin:0 auto;" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
answered Jan 4 at 18:49
Geethanjana NallaperumageGeethanjana Nallaperumage
162
add a comment |
0
Try this if looking for inline css solution. add margin:0 auto.
<div class="row">
<div style="overflow:hidden; margin:0 auto;" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
answered Jan 4 at 18:49
Geethanjana NallaperumageGeethanjana Nallaperumage
162
add a comment |
0
0
0
Try this if looking for inline css solution. add margin:0 auto.
<div class="row">
<div style="overflow:hidden; margin:0 auto;" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
answered Jan 4 at 18:49
Geethanjana NallaperumageGeethanjana Nallaperumage
162
Try this if looking for inline css solution. add margin:0 auto.
<div class="row">
<div style="overflow:hidden; margin:0 auto;" class="col-sm-8">
<img src="../../../../Images/ThinkstockPhotos-457383369.jpg" />
</div>
</div>
answered Jan 4 at 18:49
Geethanjana NallaperumageGeethanjana Nallaperumage
162
answered Jan 4 at 18:49
Geethanjana NallaperumageGeethanjana Nallaperumage
162
answered Jan 4 at 18:49
Geethanjana NallaperumageGeethanjana Nallaperumage
162
answered Jan 4 at 18:49
Geethanjana NallaperumageGeethanjana Nallaperumage
162
162
add a comment |
add a comment |
0
Twitter bootstrap has a class that centers: .pagination-centered
It worked for me to do:
<div class="row-fluid">
<div class="span12 pagination-centered"><img src="header.png" alt="header" /></div>
</div>
The css for the class is:
.pagination-centered {
text-align: center;
}
This is not working for big image
– user1030181
Jan 4 at 19:21
I want fit big image inside div
– user1030181
Jan 4 at 20:02
add a comment |
0
Twitter bootstrap has a class that centers: .pagination-centered
It worked for me to do:
<div class="row-fluid">
<div class="span12 pagination-centered"><img src="header.png" alt="header" /></div>
</div>
The css for the class is:
.pagination-centered {
text-align: center;
}
This is not working for big image
– user1030181
Jan 4 at 19:21
I want fit big image inside div
– user1030181
Jan 4 at 20:02
add a comment |
0
0
0
Twitter bootstrap has a class that centers: .pagination-centered
It worked for me to do:
<div class="row-fluid">
<div class="span12 pagination-centered"><img src="header.png" alt="header" /></div>
</div>
The css for the class is:
.pagination-centered {
text-align: center;
}
Twitter bootstrap has a class that centers: .pagination-centered
It worked for me to do:
<div class="row-fluid">
<div class="span12 pagination-centered"><img src="header.png" alt="header" /></div>
</div>
The css for the class is:
.pagination-centered {
text-align: center;
}
answered Jan 4 at 18:54
user10866229
This is not working for big image
– user1030181
Jan 4 at 19:21
I want fit big image inside div
– user1030181
Jan 4 at 20:02
add a comment |
This is not working for big image
– user1030181
Jan 4 at 19:21
I want fit big image inside div
– user1030181
Jan 4 at 20:02
This is not working for big image
– user1030181
Jan 4 at 19:21
This is not working for big image
– user1030181
Jan 4 at 19:21
I want fit big image inside div
– user1030181
Jan 4 at 20:02
I want fit big image inside div
– user1030181
Jan 4 at 20:02
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');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
StackExchange.ready(
function () {
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f54044167%2fhow-to-align-bootstrap-image-center%23new-answer', 'question_page');
}
);
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Sign up or log in
StackExchange.ready(function () {
StackExchange.helpers.onClickDraftSave('#login-link');
});
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Sign up using Google
Sign up using Facebook
Sign up using Email and Password
Post as a guest
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Required, but never shown
Where do you want to center the image? Into the
color into therow?– bep42
Jan 4 at 18:31
I want center of row
– user1030181
Jan 4 at 18:48