R
R
Roman2020-05-11 18:28:21
WordPress
Roman, 2020-05-11 18:28:21

How to set the width of a WordPress button?

How to set button width in wordpress?

I made a button using the editor inside WordPress. There are several buttons on the page - they are different in width.
How to correctly set the width of the button when editing

I understand that you need to insert the word "width" (most likely width="150"), but where exactly and what punctuation marks, where are the quotes, and after / before what to insert?

Here is the code:

< div class="wp-block-buttons"> < !-- wp:button {"backgroundColor":"vivid-green-cyan","borderRadius":10,"className":"is-style-fill"} -->
 div class="wp-block-button is-style-fill"> < a class="wp-block-button__link has-background has-vivid-green-cyan-background-color" href="http://www.makety.top/search-tenders/" style="border-radius:10px" target="_blank" rel="noreferrer noopener" >   Найти объявления  </a >  <  /div >
<!-- /wp:button --> < / div >


Here are the screenshots:

5eb96fb07f176582926425.jpeg
5eb96fb8b7a83668153031.jpeg

Answer the question

In order to leave comments, you need to log in

1 answer(s)
O
Orkhan Hasanli, 2020-05-12
@azerphoenix

Here is your source code:
And as you noticed there are errors here - unclosed tag<a>

<div class="wp-block-buttons"> 
  <div class="wp-block-button is-style-fill"> <a class="wp-block-button__link has-background has-vivid-green-cyan-background-color" href="www.makety.top/search-tenders" style="border-radius:10px" target="_blank" rel="noreferrer noopener"> Найти объявления </div>
</div>

Here is the corrected version:
<div class="wp-block-buttons"> 
  <div class="wp-block-button is-style-fill"> 
    <a class="wp-block-button__link has-background has-vivid-green-cyan-background-color" href="www.makety.top/search-tenders" style="border-radius:10px" target="_blank" rel="noreferrer noopener"> Найти объявления</a> 
  </div>
</div>

You can add CSS in many ways. For example, add a class and add styles or insert the desired style inline, etc.
It would be nice to understand what exactly is a button in this case, a tag <a>or a tag <div>
Try 2 options:
<div class="wp-block-buttons"> 
  <div class="wp-block-button is-style-fill" style="width:150px;"> 
    <a class="wp-block-button__link has-background has-vivid-green-cyan-background-color" href="www.makety.top/search-tenders" style="border-radius:10px" target="_blank" rel="noreferrer noopener"> Найти объявления</a> 
  </div>
</div>

<div class="wp-block-buttons"> 
  <div class="wp-block-button is-style-fill"> 
    <a class="wp-block-button__link has-background has-vivid-green-cyan-background-color" href="www.makety.top/search-tenders" style="width: 150px; border-radius:10px" target="_blank" rel="noreferrer noopener"> Найти объявления</a> 
  </div>
</div>

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question