El botón Safari tiene esquinas cuadradas si el texto se alarga

El contexto está en un Safari de Mac.

Estoy creando un botón HTML que tiene contenido dinámico. Puede ser "Aceptar", "Cancelar" o "Volveré más tarde", según el escenario. La propiedad de ancho máximo se establece en 100px para que no crezca demasiado y estropee el diseño. Cuando el texto del botón es más largo, el botón pierde sus esquinas redondeadas. También descubrí que el botón pierde su estilo predeterminado si su estilo es anulado por CSS ... Solo necesito que el botón se comporte como está y acomode el texto sin perder las esquinas redondeadas. ¿Alguien puede ayudarme?

gracias de antemano!

Código agregado:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
<title>Button</title>
<style>
    button{max-width:150px;}
</style>
</head>
<body>
  <button id="test">Button has a long text to test its capacity</button>
</body>
</html>

preguntado el 10 de mayo de 11 a las 13:05

Publique su código de ejemplo hasta ahora por favor. -

Código pegado. ¡Esperando una solución! -

Respuesta publicada esperando aprobación. -

1 Respuestas

Opción Actualiza tu Safari. Copié / pegué su código exacto en una página y lo abrí en Safari (recién descargado), y tiene esquinas redondeadas. También intenté aumentar el ancho máximo a 300px, y todavía funciona bien: esquinas redondeadas y todo.

Opción Cree botones con esquinas redondeadas usando HTML / CSS. ESTE SITIO es perfecto para esto, le permite elegir sus opciones, luego descargar el HTML / CSS para los botones exactos que desee, y es gratis. Por supuesto, puede modificar las opciones usted mismo o escribirlas a mano, pero es un buen punto de partida si no ha creado botones redondeados antes.

contestado el 17 de mayo de 11 a las 17:05

No es la respuesta que estás buscando? Examinar otras preguntas etiquetadas or haz tu propia pregunta.