|
Bosworthsgc
|
January 25, 2017 at 5:08 am
Hi
I am having a few issues with alignment on a mobile device
(Currently testing on a Moto G on Android)
Going to http://www.bosworthsgc.co.uk/coach-trips and selecting for example the Hampton Court Flower Show
The quantity box overshoots the side of the page
Also the title doesnt sit correctly
Not sure if this is something you can help with or if I need to refer this back to the theme developer but any help you can offer would be appreciated
Thanks
|
|
Tony
|
January 25, 2017 at 11:47 am
Hi there
The theme is setting the width of the select box to 320px wide – http://take.ms/j9rpl
On smaller screens it stays that size.
You can either change that select box width to auto for all screensizes:
.ticket-selector-tbl-qty-slct {
width: auto;
}
Or use a media query to set it only for small screens:
@media only screen
and (min-device-width: 320px)
and (max-device-width: 480px)
and (-webkit-min-device-pixel-ratio: 2) {
.ticket-selector-tbl-qty-slct {
width: auto;
}
}
I can’t see a problem with the title?
|
|
Bosworthsgc
|
January 26, 2017 at 2:48 am
Thank you – using the media query worked perfect
for the title issue I have taken a screen shot on my android moto g
|
|
Bosworthsgc
|
January 26, 2017 at 2:48 am
Moto G Screenshot
|
|
Bosworthsgc
|
January 26, 2017 at 2:49 am
As you can see the title is having letters dropped to the next line . It looks like this is because of the upcoming icon on the page
Thanks
|
|
Josh
|
January 26, 2017 at 10:42 am
You can add and make adjustments to this bit of CSS to help with the word-wrap:
@media (max-width: 500px) {
.single-espresso_events .title-header {
font-size:2em;
}
}
|
|
Bosworthsgc
|
January 27, 2017 at 2:08 am
Great – thanks Josh
|
