Viewing 7 posts - 1 through 7 (of 7 total)
  • Author
    Posts
  • May 31, 2016 at 11:27 pm #641113
    kaloraat

    Hi
    I have created a header widget and put some contact information. The widget is not responsive. It gets cut off in small screen.
    Please see the screenshot
    http://prntscr.com/bak439

    It also appears on top of body text in page scroll. The logo shrinks but the widget does not. How to make it shrink with the logo and keep it within header element?
    Please see the screenshot
    http://prntscr.com/bak439

    Please help, I have provided login details in private content too.
    Thank you!

    June 1, 2016 at 2:12 am #641130
    Vinay

    Hey kaloraat,

    We made some changes to your existing css and commented out some styles which was conflicting and added the below css in quick css.

    .custom-info{
	position: absolute;
	padding: 30px 30px 0 0;
	max-width: 1300px;
	width: 100%;
	left: 50%;
	transform: translate(-50%);
}
@media only screen and (max-width: 767px){
.logo, .custom-info{
display: block;
width: 100%;
}
.custom-info{
	position: relative;	
	text-align: center;	
}
}

    Please review the site now :)

    Best regards,
    Vinay

    June 1, 2016 at 10:02 am #641348
    kaloraat

    Hi Vinay,

    Thank you very much, However the logo image is not clickable. Only the lower bottom of the logo image is clickable and completly unclickable on page scroll (while the header is shrinked).

    Please give me css to make the whole widget custom-info behave the same way as logo, shrink on top within the header on page scroll.
    It is also no longer responsive since i have added social buttons(they must be there, clients request!) together with address, cant see in mobile.

    Please see yourself at:
    riseuptours
    I have provided the login details in this thread, if you need to login to the website.

    Thank you

    • This reply was modified 9 years ago by kaloraat.
    June 2, 2016 at 4:01 am #641786
    kaloraat

    Hi
    Waiting for someone to help..

    Thanks!

    June 3, 2016 at 4:28 am #642351
    Ismael

    Hi,

    We checked the page on mobile view and every element in the header is clickable including the logo. Could you please provide a screenshot of the issue?

    Best regards,
    Ismael

    June 3, 2016 at 4:34 am #642352
    kaloraat

    Hi Ismael

    The issue is fixed. Yigit helped me fix it, thank you for your response! You can close this thread now.

    Cheers!

    June 3, 2016 at 6:13 am #642388
    Jordan

    Hi,

    Glad to hear it’s fixed!

    Cheers,
    Jordan

  • Author
    Posts
Viewing 7 posts - 1 through 7 (of 7 total)
  • The topic ‘header widget not responsive, overflows header’ is closed to new replies.