I can't ask a question on Stack Overflow

Question

I feel very stressful when I enter Stack Overflow because it is not useful for me. When I submit my question, it gives me this:

If you need to do something that Markdown can't handle, use HTML. Note that we only support a very strict subset of HTML!

Strikethrough humor is <strike>funny</strike>.
Markdown is smart enough not to mangle your span-level HTML:

<b>Markdown works *fine* in here.</b>
Block-level HTML elements have a few restrictions:

They must be separated from surrounding text by blank lines.
The begin and end tags of the outermost block element must not be indented.
Markdown can't be used within HTML blocks.

<pre>
    You can <em>not</em> use Markdown in here.
</pre>

Also this:

Your post appears to contain code that is not properly formatted as code. Please indent all code by 4 spaces using the code toolbar button or the CTRL+K keyboard shortcut. For more editing help, click the [?] toolbar icon.

What is the meaning of these messages?

Answer 1

If you add enough substance with empty lines between code blocks and add enough non-code content it should post. Something like what is shown here. I've left the sloppy indentation, I suggest you fix that your self.

I have the following page on a WordPress site that looks like this on mobile screens:

![](https://i.ibb.co/gDBMwMs/2111.png)

As you can see the elements are not centered.

I use a `<nav>`  tag which is part of my header.php

### Header.php

    <nav class="navbar navbar-expand-md navbar-light  sticky-top" style="background-color:rgb(3, 0, 180);" role="navigation">
      <div class="container cep" >
        <!-- Brand and toggle get grouped for better mobile display -->
      
        <a class="navbar-brand"  > 
        </a>
      <?php $custom_logo_id = get_theme_mod( 'custom_logo' );
    $custom_logo_url = wp_get_attachment_image_url( $custom_logo_id , 'full' );
    echo '<img src="' . esc_url( $custom_logo_url ) . '" class="img-fluid" alt="Responsive image" style="max-height: 150px;
      max-width: 180px; padding-right:10px;">'; ?>
          
         
     <?php
               wp_nav_menu( array(
                   'menu'              => 'primary',
                   'theme_location'    => 'primary',
                   'depth'             => 2,
                   'container'         => 'div',
                   'container_class'   => 'collapse navbar-collapse',
           'container_id'      => 'bs-example-navbar-collapse-1',
                   'menu_class'        => 'nav navbar-nav',
                   'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
                   'walker'            => new wp_bootstrap_navwalker())
               );
           ?>
        </div>
    </nav>


I have the following CSS and I believe this does not work:

###CSS

<!-- language: lang-css -->

        @media screen and (max-width:900px) ,screen and (max-device-width:900px) {
    
      .cep{ 
          margin-left: auto;
      margin-right: auto;
           text-align: center;
            } 
    }
    

I'm not sure if I need to change the html, the CSS or both to have the elements centered. 

Result

The above markdown should come out as:

---

I have the following page on a WordPress site that looks like this on mobile screens:

As you can see the elements are not centered.

I use a <nav> tag which is part of my header.php

Header.php

<nav class="navbar navbar-expand-md navbar-light  sticky-top" style="background-color:rgb(3, 0, 180);" role="navigation">
  <div class="container cep" >
    <!-- Brand and toggle get grouped for better mobile display -->
  
    <a class="navbar-brand"  > 
    </a>
  <?php $custom_logo_id = get_theme_mod( 'custom_logo' );
$custom_logo_url = wp_get_attachment_image_url( $custom_logo_id , 'full' );
echo '<img src="' . esc_url( $custom_logo_url ) . '" class="img-fluid" alt="Responsive image" style="max-height: 150px;
  max-width: 180px; padding-right:10px;">'; ?>
      
     
 <?php
           wp_nav_menu( array(
               'menu'              => 'primary',
               'theme_location'    => 'primary',
               'depth'             => 2,
               'container'         => 'div',
               'container_class'   => 'collapse navbar-collapse',
       'container_id'      => 'bs-example-navbar-collapse-1',
               'menu_class'        => 'nav navbar-nav',
               'fallback_cb'       => 'wp_bootstrap_navwalker::fallback',
               'walker'            => new wp_bootstrap_navwalker())
           );
       ?>
    </div>
</nav>

I have the following CSS and I believe this does not work:

CSS

    @media screen and (max-width:900px) ,screen and (max-device-width:900px) {

  .cep{ 
      margin-left: auto;
  margin-right: auto;
       text-align: center;
        } 
}

I'm not sure if I need to change the html, the CSS or both to have the elements centered.