Community @ The Turning Gate

Support community for TTG plugins and products.

You are not logged in.

#1 2016-06-02 05:43:52

Rainer Goergen
Member
From: Trier, Germany
Registered: 2016-05-01
Posts: 355
Website

Position of - Search Button - on iPhone

Hi, if I go to the search page on my website with my iPhone 6 s plus in portrait view, the search button appears directly under the search field. Didn't find the css code to increase the space between both lines.

In landscape view there is enough space in one line.

Rainer

Offline

#2 2016-06-02 05:59:30

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,714
Website

Re: Position of - Search Button - on iPhone

try writing a media query for iPhone width and add some margin-top to the button.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#3 2016-06-02 06:34:12

Rainer Goergen
Member
From: Trier, Germany
Registered: 2016-05-01
Posts: 355
Website

Re: Position of - Search Button - on iPhone

Oh oh oh oh oh.

Offline

#4 2016-06-02 06:51:52

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,714
Website

Re: Position of - Search Button - on iPhone

need help on that?


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#5 2016-06-02 07:21:47

Rainer Goergen
Member
From: Trier, Germany
Registered: 2016-05-01
Posts: 355
Website

Re: Position of - Search Button - on iPhone

Think so, must have a look on it to understand and learn. 0.20 h a. m..
I have learned so much in the last days, because it is raining in Germany since days.

Rainer

Offline

#6 2016-06-02 07:46:08

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,714
Website

Re: Position of - Search Button - on iPhone

try this in your custom css:

@media screen and (max-width: 414px) {
	button {
		margin-top: 12px;
	}
}	

you may need to adjust the max-width.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#7 2016-06-02 15:51:13

Rainer Goergen
Member
From: Trier, Germany
Registered: 2016-05-01
Posts: 355
Website

Re: Position of - Search Button - on iPhone

Thanks Rod, all works fine with:

@media screen and (max-width: 414px) {
    button {
    margin: 10px auto;
    }
}


@media screen and (min-width: 415px) {
    button {
    margin: 10px;
    }
}

Rainer

Last edited by Rainer Goergen (2016-06-02 17:48:04)

Offline

#8 2016-06-02 21:37:49

rod barbee
Moderator
From: Port Ludlow, WA USA
Registered: 2012-09-24
Posts: 16,714
Website

Re: Position of - Search Button - on iPhone

not sure what that second media query is accomplishing for you, other than moving the button ten pixels to the right for devices between 415px and about 464px.
rainer-search-button.jpg
Try making your browser window narrower and narrower and you'll see what I mean.


Rod 
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2 test site, Pangolin test site

Offline

#9 2016-06-02 22:45:59

Rainer Goergen
Member
From: Trier, Germany
Registered: 2016-05-01
Posts: 355
Website

Re: Position of - Search Button - on iPhone

You are at thr wrong site.
You must have a look at my homepage. For me all looks fine.

At my testsite too with iPhone 6s plus and iPhone 4.

Rainer

Second media is on desktop the margin in one line to the form field.

Last edited by Rainer Goergen (2016-06-02 22:48:44)

Offline

Board footer

Powered by FluxBB