मैं वर्तमान में आच्छादित तालिका पंक्ति को एक रूपरेखा के साथ हाइलाइट करने का प्रयास कर रहा हूं। यह फ़ायरफ़ॉक्स और क्रोम में त्रुटिपूर्ण रूप से काम करता है ... लेकिन सफारी किसी तरह रूपरेखा को क्लिप करता है।

पहली छवि फ़ायरफ़ॉक्स दिखाती है ... दूसरी सफारी है।

Firefox Safari

सीएसएस बल्कि सरल है:

table tbody tr:hover {
    background-color: #48f2;
    outline: 3px solid #48f8;
}

इस व्यवहार का क्या कारण हो सकता है? क्या यह ज्ञात बग है?

पुनश्च: सफारी (सीएमडी + टैब) को छिपाना और बिना किसी माउस आंदोलन के इसे फिर से दिखाना <tr> को ठीक से प्रस्तुत करता है ... इसलिए मैं इसे एक डिस्प्ले बग मानता हूं। लेकिन शायद कोई उपाय है?

0
Daniel Bleisteiner 22 अप्रैल 2020, 09:20

1 उत्तर

सबसे बढ़िया उत्तर

मैंने आज कुछ स्पष्ट करने की कोशिश की है ... और यह काम किया:

/* default state for Safari */
table tbody tr {
    outline: 3px solid #0000;
}
/* highlight table row upon hover */
table tbody tr:hover {
    background-color: #48f2;
    outline: 3px solid #48f8;
}

डिफ़ॉल्ट स्थिति के लिए बस एक पारदर्शी रूपरेखा सेट करने से इस Safari बग का समाधान हो गया। मुझे लगता है कि सफारी पृष्ठ के प्रारंभिक रेंडर के दौरान बाहरी सीमाओं को निर्धारित करती है और बाद में प्रतिपादन को और अनुकूलित करने के लिए इसका उपयोग करती है।

0
Daniel Bleisteiner 23 अप्रैल 2020, 05:18