The forum of the forums
Welcome to the Official Support Forum of Forumotion!

To take full advantage of everything offered by our forum, please log in if you are already a member, or join our community if you've not yet.



Create a free forum like this one.

Search button shifted on my banner on mobiles and tablets

View previous topic View next topic Go down

Solved Search button shifted on my banner on mobiles and tablets

Post by betclever on October 22nd 2014, 5:22 pm

Hi all,

The "search button" is shifted on my banner on mobiles and tablets when the member uses the "web version".

I don't have this issue on my computer or on other computers "according to my members"



Thanks a lot for your help!


Last edited by betclever on October 23rd 2014, 1:58 am; edited 1 time in total

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by Ramdaman on October 22nd 2014, 6:32 pm

Where would you like the search button, all the way to the right?

Ramdaman
Active Poster

Male Posts : 1614
Reputation : 96
Language : English, Albanian, Macedonian, Russian | HTML, CSS
Location : New York City

http://ndihme.forumotion.com/forum

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by betclever on October 22nd 2014, 8:37 pm

Hello Ramdaman,

Yes indeed but don't forget, there is no issue on the web version when I'm using my computer...

It is only on "web" version when I'm using tablet or mobile.

Thanks a lot,

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by Ramdaman on October 22nd 2014, 8:53 pm

Try placing this into your CSS stylesheet:
Code:
#search > p.nomargin {
 font-size: 1.1em;
 line-height: 1.3em;
 margin-bottom: 0;
 float: right;
}

Ramdaman
Active Poster

Male Posts : 1614
Reputation : 96
Language : English, Albanian, Macedonian, Russian | HTML, CSS
Location : New York City

http://ndihme.forumotion.com/forum

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by betclever on October 23rd 2014, 12:29 am

Hey,

I have added this code but same issue, the search bar is on the "E" of my banner.

Here is the URL of my forum: www.betclever.net

Thanks,

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by Ange Tuteur on October 23rd 2014, 12:46 am

Hello betclever,

The search box is absolutely positioned, so this means it will go to the absolute edges of the screen when the page is loaded. On smaller screens it will cause the search to overlap your banner.

You could relatively position it instead :
Code:
#page-header #search-box {
 position:relative;
 top:-200px;
 right:-10px;
 margin:-10px 0;
}

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by betclever on October 23rd 2014, 12:50 am

Thanks ange tuteur Wink

Shall I remove the first CSS code or let it and add the one you have posted?

Thanks,

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by Ange Tuteur on October 23rd 2014, 1:18 am

Yes, you can remove that one. Wink

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by betclever on October 23rd 2014, 1:32 am

Hello,

I have tried the code you have posted but now the search bar goes to the right on the "R" of my banner and the word "betclever"

Any idea?

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by Ange Tuteur on October 23rd 2014, 1:38 am

Hmm .. try using a percent for right :
Code:
#page-header #search-box {
  position:relative;
  top:-200px;
  right:-10%;
  margin:-10px 0;
}

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by betclever on October 23rd 2014, 1:50 am

In fact, I just saw on the top of my forum on the left side (on the bar) the same thing.

So finaly, is there any possibility to remove the search bar on the right side?

I have tried this code but it doesn't work:



Code:
#forum-search {
display: none;
}
PS: I have added this one on my CSS sheet.

Thanks,

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by Ange Tuteur on October 23rd 2014, 1:55 am

Of course, you can hide it with this Rule :
Code:
#search-box { display:none }

You can remove the other CSS I provided you, if you like. Wink

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by betclever on October 23rd 2014, 1:57 am

Thanks a lot, it works!

Smile

betclever
Forumember

Posts : 209
Reputation : 2
Language : english

http://www.betclever.net

Back to top Go down

Solved Re: Search button shifted on my banner on mobiles and tablets

Post by Ange Tuteur on October 23rd 2014, 2:03 am

De rien ^^

Topic archived

Ange Tuteur
Forumaster

Male Posts : 13021
Reputation : 2683
Language : EN10, FR5
Location : Pennsylvania

http://fmdesign.forumotion.com

Back to top Go down

View previous topic View next topic Back to top


 
Permissions in this forum:
You cannot reply to topics in this forum