title: How would you add constant space between centered items in CSS? (EDITED)
body: <p>This might seem like a common question, but I feel like I'm completely stuck.</p>
  
  <p>So I want to create a website, part of which has two elements in a container: title text and a button. I want to place them in the center of the main axis (the container), with some space between them. I don't like the <code>justify-content: space-around</code> option because it leaves too much space in the middle. So to do this, I would use left/right margins for each of the elements. But I also want to use <code>flex-wrap: wrap;</code>, meaning that if the screen size is too small to fit both of the elements, css would transfer the button to the next line. Every time this happens however, the <code>margin-left</code> still remains on the button, so it looks off-centered. (See image) <a href="https://i.stack.imgur.com/fvc6A.png" rel="nofollow noreferrer">The elements were centered, but when I shrink the window, this is what happens</a></p>
  
  <p>Any ideas? Thanks.</p>
  
  <p><strong>EDIT: Using media queries messes things up, so my new question is this: Is there a way to make the space between two centered elements hold constant to all screen sizes without margins?</strong></p>