- This topic has 5 replies, 2 voices, and was last updated 4 years, 6 months ago by Leo.
-
AuthorPosts
-
September 7, 2019 at 6:52 pm #1003708dongsoon
Hi,
I find a some problem.
I do not use page bilder.
So we applied the Page Hero Example 3 proposed in this theme.As you know this is described at https://docs.generatepress.com/article/page-hero-examples/.
I used the following code:
<div class="page-hero-content"> <h2>그대 가슴을 뛰게하는 필드로 오라!</h2> <h3>골프는 내가 통제하거나 지배할 수 있는 게임이 아니다. 골프는 내려놓는 게임이다.- 제스퍼 파네빅</h3> <h3>가장 재미있는 운동이면서 인생 축소판같은 골프</h3> <h3>난코스의 도전을 극복하고 회심의 미소를 지어 보자!!</h3> <div class="page-hero-buttons"> <a href="https://ownergolf.net/조인/" class="button_join_front">조인 예약</a> <a href="https://ownergolf.net/부킹/" class="button_booking_front">실시간 예약</a> </div> </div>
This works well for most Internet browsers such as crome, fire fox, and edge. But it seems broken only in IE 11.
My issued page is https://ownergolf.net.
Can you advise what the problem is?
Upload some images to identify the problem.
1. This is a comparison image between Crome and IE 11.
2. This is the Element setting screen.
September 7, 2019 at 8:30 pm #1003737LeoStaffCustomer SupportHi there,
IE is definitely a pain to deal with most of the time.
Might be a good idea to run your CSS through this site for compatibility:
https://autoprefixer.github.io/For example, the CSS in example 3 would become:
.page-hero-content { padding: 20px; border: 5px solid rgba(211,211,35,0.2); border-radius: 10px; max-width: 700px; } @media (max-width: 1200px) { .page-hero-content { padding: 10px; margin: auto; } } .inside-page-hero { display: -ms-grid; display: grid; grid-template-areas: "left right"; -ms-grid-columns: 50% 50%; grid-template-columns: 50% 50%; } .page-hero-content { -ms-grid-row: 1; -ms-grid-column: 2; grid-area: right; } @media (max-width: 768px) { .inside-page-hero { display: block; } }
Let me know if this helps 🙂
September 8, 2019 at 6:27 am #1003932dongsoonHi,
Thank you for help.But is there any way to apply style ONLY on IE?
Your proposed code snippet is some work on IE, but Things get worse in other browsers.Anyway, I solve this problem by setting top padding to 70px.
Thanks again
September 8, 2019 at 8:02 am #1004082LeoStaffCustomer SupportDon’t think there is way to apply style only to IE, unfortunately.
Glad you found a solution 🙂
September 8, 2019 at 8:35 am #1004105dongsoonThanks
Have a good day!!September 8, 2019 at 9:10 am #1004117LeoStaffCustomer SupportNo problem 🙂
-
AuthorPosts
- You must be logged in to reply to this topic.