Мой фон кнопки кажется растянутым - PullRequest
Новая
       29

Мой фон кнопки кажется растянутым

1 голос
/ 24 марта 2010

У меня есть кнопка, чтобы вы могли видеть здесь .Выглядит хорошо, правда?Ну на живом сайте, euroworker.no / shipping и / selectAddress кажется растянутым.

Хорошо отрисовывается в Chrome, IE и Safari, я думал, что это может быть проблема с FF, но загрузил скрипту в FF и выглядит нормально.

Быстрый реф CSS и html: 

#fortsett_btn  {
   background-image: url(http://euroworker.no/public/upload/fortsett.png?1269434047);
   background-repeat:no-repeat;
   background-position:left;
   background-color:none;
    border:none;
    outline:none;
   visibility: visible;
   position: relative;
   z-index: 2;
   width: 106px;
   height: 25px;
   cursor:pointer;
}​

И HTML 

<button type="submit" class="submit" id="fortsett_btn" title="Fortsett" value="">&nbsp;</button>​

Интересно, что с этим.

Ответы [ 2 ]

1 голос
/ 24 марта 2010

Я не уверен, что понимаю проблему. CSS отличается в каждом случае. На Fiddle у вас есть одно изображение с фоновым повторением, установленным на отсутствие повторения. На живом сайте у вас есть фрагмент другого изображения с background-repeat, установленным в repeat-x. Это два разных способа оформления кнопки.

Fiddle: 

#fortsett_btn {
background-image:url("http://euroworker.no/public/upload/fortsett.png?1269434047");
background-position:left center;
background-repeat:no-repeat;
border:medium none;
cursor:pointer;
height:25px;
position:relative;
visibility:visible;
width:106px;
z-index:2;
}

Live: 

#product___specField_8  {
-moz-border-radius:5px 0 0 5px;
background-image:url("stylesheet/frontend/../../upload/orng_bg.png?1269434608");
background-repeat:repeat-x;
border:1px solid #DDDDDD;
float:left;
font-size:24px;
font-weight:bold;
height:33px;
padding-left:55px;
width:124px;
}

Почему бы вам не ожидать увидеть что-то другое?

1 голос
/ 24 марта 2010

вместо 

<button type="submit" class="submit" id="fortsett_btn" title="Fortsett" value="">&nbsp;</button>

Попробуйте это: 

<button type="submit" class="submit" id="fortsett_btn" title="Fortsett" value="">Some value</button>

затем добавьте text-indent:-999px; к вашему CSS

Это не имеет никакого отношения к тому, почему ваша кнопка не изменяется на живом сайте, это просто предложение. Возможно, кнопка не соответствует стилю, потому что вам не хватает таблицы стилей (неправильная ссылка), попробуйте выполнить ее встроенный стиль, а затем, если она работает, скопируйте стиль в таблицу стилей

...