Замена и выравнивание кнопок

Первое сообщение в теме :



Помогите эти кнопки (да/нет) ровно по центру и поменять их стиль под стиль сайта.
Вот так вышлядит мой шаблон confirm_body:

Код:

<div align="center"><div class="main">
   <div class="main-head"><h1 class="page-title">{MESSAGE_TITLE}</h1></div>
   <div class="main-content">
   <form action="{S_CONFIRM_ACTION}" method="post" class="frm-form">
      <p class="frm-info">{MESSAGE_TEXT}</p>
      {OPTIONAL_BAN_NEW}
      <fieldset class="frm-set">
         <dl>
            <dt></dt>
            <dd>
               {S_HIDDEN_FIELDS}
<input type="submit" name="confirm" value="{L_YES}" />&nbsp;
<input type="submit" name="cancel" value="{L_NO}" />
            </dd>
         </dl>
      </fieldset>
   </form></div>
  </div>
</div> 

Я пробовал сам, но у меня не получается, кнопки все равно стоят не ровно по центру, а правее.

Так же нужно их изменить на такие:


Вот код этих кнопок:
В CSS:

Код:

.button{text-decoration:none; text-align:center;
 padding:11px 38px;
 border:solid 1px #777777;
 -webkit-border-radius:3px;
 -moz-border-radius:3px;
 border-radius: 3px;
 font:12px Arial, Helvetica, sans-serif;
 font-weight:bold;
 color:#ffffff;
 background:#000000;
 -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
 -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff; 
 box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff; 
 
  }.button:hover{
 padding:11px 38px;
 border:solid 1px #01A1DF;
 -webkit-border-radius:3px;
 -moz-border-radius:3px;
 border-radius: 3px;
 font:12px Arial, Helvetica, sans-serif;
 font-weight:bold;
 color:#00a6ff;
 background:#000000;
 -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
 -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff; 
 box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff; 
 
 }.button:active{
 padding:11px 38px;
 border:solid 1px #00a6ff;
 -webkit-border-radius:3px;
 -moz-border-radius:3px;
 border-radius: 3px;
 font:12px Arial, Helvetica, sans-serif;
 font-weight:bold;
 color:#00a6ff;
 background:#000000;
 -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
 -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff; 
 box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff; 
 
 }

Код самой кнопки:

Код:

<a href="ссылка на то, куда ведет кнопка" class="button"/>Текст кнопки</a>

Помогите плиз.

)))

@Lola888 пишет:)))

И к чему это?

^

Xan_Kriegor, здравствуйте Речь о кнопках-выход из П/А? (это единственное, где я нашла)
Сразу ньюансы: в шаблоне есть фельд <dt></dt>, он имеет ширину 16 емов, из-за этого центрирование "уходит" вправо. Убрать этот фельд-лучше не надо, вдруг в какой нибудь другой локации это важно? (я НЕ знаю, но там и шрифту стили заданы, пусть лучше останется).
Поэтому, я прописала в процентах (42), у меня вроде ровно на разных размерах экрана, но вы попробуйте своим взглядом.
На сколько это правильно-тоже не знаю. Но вроде работает.
Вобщем, вы попробуйте, если что-удалите (и установите шаблон по умолчанию).

Вот вам шаблон confirm_body:

Код:

   <div class="main">
       <div class="main-head"><h1 class="page-title">{MESSAGE_TITLE}</h1></div>
       <div class="main-content">
       <form action="{S_CONFIRM_ACTION}" method="post" class="frm-form">
          <p class="frm-info">{MESSAGE_TEXT}</p>
          {OPTIONAL_BAN_NEW}
          <fieldset class="frm-set">
             <dl>
                <dt></dt>
                <dd>
                   {S_HIDDEN_FIELDS}
    <input type="submit" name="confirm" value="{L_YES}" />&nbsp;
    <input type="submit" name="cancel" value="{L_NO}" />
                </dd>
             </dl>
          </fieldset>
       </form></div>
      </div>
      <style type="text/css">fieldset.frm-set dl dd {
    margin-left: 42%;
}    .pun input:hover{
     padding:11px 38px;
     border:solid 1px #01A1DF;
     -webkit-border-radius:3px;
     -moz-border-radius:3px;
     border-radius: 3px;
     font:12px Arial, Helvetica, sans-serif;
     font-weight:bold;
     color:#00a6ff;
     background-color: #000 !important;
     -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
     -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff;  
     box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;  
      
     }.pun input{text-decoration:none; text-align:center;
     padding:11px 38px;
     border:solid 1px #777777;
     -webkit-border-radius:3px;
     -moz-border-radius:3px;
     border-radius: 3px;
     font:12px Arial, Helvetica, sans-serif;
     font-weight:bold;
     color:#ffffff;
     background-color: #000 !important;
     -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
     -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff;  
     box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;  
      
      }</style>

Ой, простите, не заметила что вопрос "Вы действительно хотите выйти?" уже слева, я ведь удалила ваше центрирование (не совместимо)...
Эх, зря поторопилась, извините

Муха, речь идет о кнопках, которые на самом сайте, а не в ПА. Мне нужно сделать их ровно по центру и стилизовать, как ч описал выше.

@Xan_Kriegor пишет:Муха, речь идет о кнопках, которые на самом сайте, а не в ПА.

Это понятно. Просто у меня вопрос "действительно хотите выйти" появляется, если я из админки нажимаю кнопку выход. А с форума вылетаю сразу.

Ну, вобщем понятно, вы даже не попробовали, хотя стили кнопок я ставила ваши, а не свои "фантазировала".

Муха, Спасибо тебе огромное)) Я-то все попробовал и поставил. Стили кнопок поменялись и они ровно по центру.

Как мне теперь сделать так, чтобы и надпись "Вы действительно хотите выйти?" была по центру?
Все все все - сам допетрил, что да как...

Прости, еще крохотный вопрос, как сделать, чтобы ссылки "ДА/НЕТ" подчеркивались???
Т. е. вот так, как например тут:

@Xan_Kriegor пишет:Как мне теперь сделать так, чтобы и надпись "Вы действительно хотите выйти?" была по центру?
Все все все - сам допетрил, что да как...

О, а я как раз готовый шаблон принесла, выровненный.
==========================
Вот шаблон, это с вашим центрированием и стилем кнопок (как и вчерашний), но теперь всё по центру (вроде), и подчёркивание при наведении:

Код:

        <div align="center"><div class="main">
       <div class="main-head"><h1 class="page-title">{MESSAGE_TITLE}</h1></div>
       <div class="main-content">
       <form action="{S_CONFIRM_ACTION}" method="post" class="frm-form">
          <p class="frm-info">{MESSAGE_TEXT}</p>
          {OPTIONAL_BAN_NEW}
          <fieldset class="frm-set">
             <dl>
                <dt></dt>
                <dd>
                   {S_HIDDEN_FIELDS}
    <input type="submit" name="confirm" value="{L_YES}" />&nbsp;
    <input type="submit" name="cancel" value="{L_NO}" />
                </dd>
             </dl>
          </fieldset>
       </form></div>
      </div>
    </div>  
<style type="text/css">fieldset.frm-set dl dd, fieldset.frm-set dl dt {
    padding: 0em;
}  .pun input:hover{text-decoration: underline;
     padding:11px 38px;
     border:solid 1px #01A1DF;
     -webkit-border-radius:3px;
     -moz-border-radius:3px;
     border-radius: 3px;
     font:12px Arial, Helvetica, sans-serif;
     font-weight:bold;
     color:#00a6ff;
     background-color: #000 !important;
     -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
     -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff;  
     box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;  
      
     }.pun input{text-decoration:none; text-align:center;
     padding:11px 38px;
     border:solid 1px #777777;
     -webkit-border-radius:3px;
     -moz-border-radius:3px;
     border-radius: 3px;
     font:12px Arial, Helvetica, sans-serif;
     font-weight:bold;
     color:#ffffff;
     background-color: #000 !important;
     -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
     -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff;  
     box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;  
      
      }</style>  

Огромное спасибо тебе))))))
Эх... Все равно у меня кнопки справа, а не по центру...
Подчеркивание есть, но мышь не меняет курсор, как при наведении на ссылку... Но это не страшно... Главное, что кнопки почему-то не по центру...

Xan_Kriegor, я зарегистрировалась, у меня кнопки ровно (стоит 43,37% отступ)


А вот подчёркивания у меня нет Хотя на моём форуме этот шаблон срабатывает, как я вам выше показала скрином...
Про курсор: у вас в CSS стиль стоит? Его наверно надо переставить в самый низ CSS (тогда на всех ссылках должен срабатывать)(террррритически ), илил дайте мне, я попробую прописать в шаблон.

(вы позавчерашний шаблон поставили?)

Приветик) Я поставил этот шаблон из этого сообщения:

@Муха пишет:Xan_Kriegor, здравствуйте Речь о кнопках-выход из П/А? (это единственное, где я нашла)
Сразу ньюансы: в шаблоне есть фельд <dt></dt>, он имеет ширину 16 емов, из-за этого центрирование "уходит" вправо. Убрать этот фельд-лучше не надо, вдруг в какой нибудь другой локации это важно? (я НЕ знаю, но там и шрифту стили заданы, пусть лучше останется).
Поэтому, я прописала в процентах (42), у меня вроде ровно на разных размерах экрана, но вы попробуйте своим взглядом.
На сколько это правильно-тоже не знаю. Но вроде работает.
Вобщем, вы попробуйте, если что-удалите (и установите шаблон по умолчанию).

Вот вам шаблон confirm_body:

Код:

   <div class="main">
       <div class="main-head"><h1 class="page-title">{MESSAGE_TITLE}</h1></div>
       <div class="main-content">
       <form action="{S_CONFIRM_ACTION}" method="post" class="frm-form">
          <p class="frm-info">{MESSAGE_TEXT}</p>
          {OPTIONAL_BAN_NEW}
          <fieldset class="frm-set">
             <dl>
                <dt></dt>
                <dd>
                   {S_HIDDEN_FIELDS}
    <input type="submit" name="confirm" value="{L_YES}" />&nbsp;
    <input type="submit" name="cancel" value="{L_NO}" />
                </dd>
             </dl>
          </fieldset>
       </form></div>
      </div>
      <style type="text/css">fieldset.frm-set dl dd {
    margin-left: 42%;
}    .pun input:hover{
     padding:11px 38px;
     border:solid 1px #01A1DF;
     -webkit-border-radius:3px;
     -moz-border-radius:3px;
     border-radius: 3px;
     font:12px Arial, Helvetica, sans-serif;
     font-weight:bold;
     color:#00a6ff;
     background-color: #000 !important;
     -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
     -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff;  
     box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;  
      
     }.pun input{text-decoration:none; text-align:center;
     padding:11px 38px;
     border:solid 1px #777777;
     -webkit-border-radius:3px;
     -moz-border-radius:3px;
     border-radius: 3px;
     font:12px Arial, Helvetica, sans-serif;
     font-weight:bold;
     color:#ffffff;
     background-color: #000 !important;
     -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
     -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff;  
     box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;  
      
      }</style>

Я просто нашел, где подправить, чтобы сама надпись "Вы действительно хотите выйти?" была по центру. Сами кнопки я двигал вручную, изменяя вот этот параметр "margin-left: 42%;". А вот с подчеркиванием и курсором беда...
А как называются настройки стиля курсора? Просто у меня дофига всего в CSS и я не знаю, как и что именно искать?

Новый шаблон, который ты последним давала, пробую ставить, который "выровненный с моим центрированием" - кнопки съезжают вправо...

@Xan_Kriegor пишет: Я поставил этот шаблон из этого сообщения:

Добрый!
Ну так подчёркивание во втором примере.
Вот этот шаблон (который вы процитировали) уже с подчёркиванием (только снова проценты замените):

Код:

      <div class="main">
           <div class="main-head"><h1 class="page-title">{MESSAGE_TITLE}</h1></div>
           <div class="main-content">
           <form action="{S_CONFIRM_ACTION}" method="post" class="frm-form">
              <p class="frm-info">{MESSAGE_TEXT}</p>
              {OPTIONAL_BAN_NEW}
              <fieldset class="frm-set">
                 <dl>
                    <dt></dt>
                    <dd>
                       {S_HIDDEN_FIELDS}
        <input type="submit" name="confirm" value="{L_YES}" />&nbsp;
        <input type="submit" name="cancel" value="{L_NO}" />
                    </dd>
                 </dl>
              </fieldset>
           </form></div>
          </div>
          <style type="text/css">fieldset.frm-set dl dd {
        margin-left: 42%;
    }    .pun input:hover{text-decoration: underline;

         padding:11px 38px;
         border:solid 1px #01A1DF;
         -webkit-border-radius:3px;
         -moz-border-radius:3px;
         border-radius: 3px;
         font:12px Arial, Helvetica, sans-serif;
         font-weight:bold;
         color:#00a6ff;
         background-color: #000 !important;
         -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
         -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff;  
         box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;  
          
         }.pun input{text-decoration:none; text-align:center;
         padding:11px 38px;
         border:solid 1px #777777;
         -webkit-border-radius:3px;
         -moz-border-radius:3px;
         border-radius: 3px;
         font:12px Arial, Helvetica, sans-serif;
         font-weight:bold;
         color:#ffffff;
         background-color: #000 !important;
         -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
         -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff;  
         box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;  
          
          }</style>

@Xan_Kriegor пишет:Просто у меня дофига всего в CSS и я не знаю, как и что именно искать?

А вам палец нужен? (ну, курсор при наведении становится пальцем).
Если такая стрелка-как в примере первого поста, то я такое не умею, поищите в CSS cursor (а может в скриптах? простите, не сильна..)

Муха, Спасибки тебе огромные))) Все круто, но как сделать, чтобы курсор менялся под ссылочный, я так и не допер...

Xan_Kriegor, не за что

@Xan_Kriegor пишет:но как сделать, чтобы курсор менялся под ссылочный

Если вас устроит курсор при наведении-"пальцем", то вот шаблон:

Код:



          <div class="main">
              <div class="main-head"><h1 class="page-title">{MESSAGE_TITLE}</h1></div>
              <div class="main-content">
              <form action="{S_CONFIRM_ACTION}" method="post" class="frm-form">
                  <p class="frm-info">{MESSAGE_TEXT}</p>
                  {OPTIONAL_BAN_NEW}
                  <fieldset class="frm-set">
                    <dl>
                        <dt></dt>
                        <dd>
                          {S_HIDDEN_FIELDS}
            <input type="submit" name="confirm" value="{L_YES}" />&nbsp;
            <input type="submit" name="cancel" value="{L_NO}" />
                        </dd>
                    </dl>
                  </fieldset>
              </form></div>
              </div>
              <style type="text/css">fieldset.frm-set dl dd {
            margin-left: 42%;
        }    .pun input:hover{text-decoration: underline;
              cursor: pointer;
            padding:11px 38px;
            border:solid 1px #01A1DF;
            -webkit-border-radius:3px;
            -moz-border-radius:3px;
            border-radius: 3px;
            font:12px Arial, Helvetica, sans-serif;
            font-weight:bold;
            color:#00a6ff;
            background-color: #000 !important;
            -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
            -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff; 
            box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff; 
             
            }.pun input{text-decoration:none; text-align:center;
            padding:11px 38px;
            border:solid 1px #777777;
            -webkit-border-radius:3px;
            -moz-border-radius:3px;
            border-radius: 3px;
            font:12px Arial, Helvetica, sans-serif;
            font-weight:bold;
            color:#ffffff;
            background-color: #000 !important;
            -webkit-box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff;
            -moz-box-shadow: 0px 0px 2px #777777,  inset 0px 0px 1px #ffffff; 
            box-shadow:0px 0px 2px #777777, inset 0px 0px 1px #ffffff; 
             
              }</style>

Муха, вот теперь все отлично! Жаль конечно, что кнопки нельзя поставить именно по центру, а приходится их двигать вручную, с пом. параметра "margin-left:".
Но в целом все ок.
Спасибо тебе большое!!!