How to center a section with bulma

up vote
0
down vote

favorite

I am using bulma framework , and all the content is to the left, how would I center the content on the page? For example this image is to the left.

<section class="section">
 <div class="container">
 <div class="column">
 <figure>
 <img src="/assets/images/norris-lake.jpg" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
</section>

edited Nov 10 at 22:47

ksav

3,64221227

asked Nov 10 at 22:32

user41758

556

add a comment |

up vote
0
down vote

favorite

I am using bulma framework , and all the content is to the left, how would I center the content on the page? For example this image is to the left.

<section class="section">
 <div class="container">
 <div class="column">
 <figure>
 <img src="/assets/images/norris-lake.jpg" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
</section>

edited Nov 10 at 22:47

ksav

3,64221227

asked Nov 10 at 22:32

user41758

556

add a comment |

up vote
0
down vote

favorite

I am using bulma framework , and all the content is to the left, how would I center the content on the page? For example this image is to the left.

<section class="section">
 <div class="container">
 <div class="column">
 <figure>
 <img src="/assets/images/norris-lake.jpg" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
</section>

edited Nov 10 at 22:47

ksav

3,64221227

asked Nov 10 at 22:32

user41758

556

I am using bulma framework , and all the content is to the left, how would I center the content on the page? For example this image is to the left.

<section class="section">
 <div class="container">
 <div class="column">
 <figure>
 <img src="/assets/images/norris-lake.jpg" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
</section>

<section class="section">
 <div class="container">
 <div class="column">
 <figure>
 <img src="/assets/images/norris-lake.jpg" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
</section>

<section class="section">
 <div class="container">
 <div class="column">
 <figure>
 <img src="/assets/images/norris-lake.jpg" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
</section>

html bulma

edited Nov 10 at 22:47

ksav

3,64221227

asked Nov 10 at 22:32

user41758

556

edited Nov 10 at 22:47

ksav

3,64221227

asked Nov 10 at 22:32

user41758

556

edited Nov 10 at 22:47

ksav

3,64221227

edited Nov 10 at 22:47

ksav

3,64221227

edited Nov 10 at 22:47

ksav

3,64221227

asked Nov 10 at 22:32

user41758

556

asked Nov 10 at 22:32

user41758

556

asked Nov 10 at 22:32

user41758

556

add a comment |

1 Answer
1

active

oldest

votes

up vote
1
down vote

accepted

Why not have a look at the Bulma docs

<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet" />
<section class="section">
 <div class="container">
 <div class="columns is-centered">
 <div class="column is-half">
 <figure>
 <img src="https://placeimg.com/640/480/any" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
 </div>
</section>

answered Nov 10 at 22:44

ksav

3,64221227

Thanks, I am still trying to go threw documents, I find myself lost at times , at where I need to look. I tried the "is-centered" but did not help so the "is-half" with it is the key. Thanks for help!
– user41758
Nov 10 at 22:54

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',
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

StackExchange.ready(
function ()
StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53244082%2fhow-to-center-a-section-with-bulma%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

up vote
1
down vote

accepted

Why not have a look at the Bulma docs

<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet" />
<section class="section">
 <div class="container">
 <div class="columns is-centered">
 <div class="column is-half">
 <figure>
 <img src="https://placeimg.com/640/480/any" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
 </div>
</section>

answered Nov 10 at 22:44

ksav

3,64221227

Thanks, I am still trying to go threw documents, I find myself lost at times , at where I need to look. I tried the "is-centered" but did not help so the "is-half" with it is the key. Thanks for help!
– user41758
Nov 10 at 22:54

add a comment |

up vote
1
down vote

accepted

Why not have a look at the Bulma docs

<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet" />
<section class="section">
 <div class="container">
 <div class="columns is-centered">
 <div class="column is-half">
 <figure>
 <img src="https://placeimg.com/640/480/any" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
 </div>
</section>

answered Nov 10 at 22:44

ksav

3,64221227

Thanks, I am still trying to go threw documents, I find myself lost at times , at where I need to look. I tried the "is-centered" but did not help so the "is-half" with it is the key. Thanks for help!
– user41758
Nov 10 at 22:54

add a comment |

up vote
1
down vote

accepted

Why not have a look at the Bulma docs

<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet" />
<section class="section">
 <div class="container">
 <div class="columns is-centered">
 <div class="column is-half">
 <figure>
 <img src="https://placeimg.com/640/480/any" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
 </div>
</section>

answered Nov 10 at 22:44

ksav

3,64221227

Why not have a look at the Bulma docs

<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet" />
<section class="section">
 <div class="container">
 <div class="columns is-centered">
 <div class="column is-half">
 <figure>
 <img src="https://placeimg.com/640/480/any" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
 </div>
</section>

<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet" />
<section class="section">
 <div class="container">
 <div class="columns is-centered">
 <div class="column is-half">
 <figure>
 <img src="https://placeimg.com/640/480/any" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
 </div>
</section>

<link href="https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.2/css/bulma.css" rel="stylesheet" />
<section class="section">
 <div class="container">
 <div class="columns is-centered">
 <div class="column is-half">
 <figure>
 <img src="https://placeimg.com/640/480/any" alt="Melton Hill Lake">
 </figure>
 </div>
 </div>
 </div>
</section>

answered Nov 10 at 22:44

ksav

3,64221227

answered Nov 10 at 22:44

ksav

3,64221227

answered Nov 10 at 22:44

ksav

3,64221227

answered Nov 10 at 22:44

ksav

3,64221227

Thanks, I am still trying to go threw documents, I find myself lost at times , at where I need to look. I tried the "is-centered" but did not help so the "is-half" with it is the key. Thanks for help!
– user41758
Nov 10 at 22:54

add a comment |

Thanks, I am still trying to go threw documents, I find myself lost at times , at where I need to look. I tried the "is-centered" but did not help so the "is-half" with it is the key. Thanks for help!
– user41758
Nov 10 at 22:54

Thanks, I am still trying to go threw documents, I find myself lost at times , at where I need to look. I tried the "is-centered" but did not help so the "is-half" with it is the key. Thanks for help!
– user41758
Nov 10 at 22:54

add a comment |

draft saved

draft discarded

draft saved

draft discarded

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

搜尋此網誌

Myujth