Centering modal title and glyph

Thank you for help.
this is my experiment regarding centering modal title and glyphicon and setting size’
I can see iy is not the right way, title words are upon each other and other things might be that I don’t see., please help me, thank you.

<!DOCTYPE html>
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="stylesheet" href="">

<link rel="stylesheet" href="">
    <script src=""></script>
    <script src=""></script>
	.centergl { padding: 20px 50%;
    .centerttl { display: block;
				 margin-left: 50%;
				 margin-right: 50%; 

<div class="w3-container">
  <h2>W3.CSS Modal</h2>
  <p>Use w3-container classes to create different sections in the modal (e.g. header & footer).</p>
  <button onclick="document.getElementById('id01').style.display='block'" class="w3-button w3-black">Open Modal</button>

  <div id="id01" class="w3-modal">
    <div class="w3-modal-content">
      <header class="w3-container w3-teal"> 
        <span onclick="document.getElementById('id01').style.display='none'" 
        class="w3-button w3-display-topright">&times;</span>
        <span class="glyphicon glyphicon-user centergl"></span>
        <h2 class="centerttl">Modal Header</h2>
      <div class="w3-container">
        <p>Some text..</p>
        <p>Some text..</p>
      <footer class="w3-container w3-teal">
        <p>Modal Footer</p>

You could also try center align the text/glyph in block containers, like:

.centergl {
  display: block;
  padding: 20px 0;
  text-align: center;
  font-size: 6em;
.centerttl {
  margin: .5em 0;
  text-align: center;
  font-size: 3em;

thank you for help it is lovely. I have a bs3 modal and I try to sort out it’s code this way.
I would like to ask, how can I make bigger the closing tag on the top right corner and change color? thank you.
thank you.

1 Like

Set a font-size for the element.

If you only want to change the colour of the “X”, then again, simply add the color rule to the styles.

thank you, can I make a bit bigger?

Please read my previous reply.

This topic was automatically closed 91 days after the last reply. New replies are no longer allowed.