Forum replies created
I’m sorry, you misunderstood what I said in my previous reply.
I’ve re-designed the form in question to remove all table elements and replace with div which takes the Magic Liquidizer Responsive Table plugin out of the equation..
What I am saying is now that I have redesigned with div elements, the element is not resizing for the viewing portal from a mobile device in portrait mode. It works just fine in landscape mode. See screen shot links in previous reply.
The form is still technically functional, just not sizing properly. Is there a way to fix this?
I was logged in when the customization request was submitted and I signed in before trying the Ticket Detail link from the update email I received.
Since the image tool didn’t work in my previous response, screenshots can be seen using the links below.
http://www.event1software.com/wp-content/uploads/Screenshot_20161214-133543.png
http://www.event1software.com/wp-content/uploads/Screenshot_20161214-133550.png
I think I understand what you were describing, ie. my plugin Magic Liquidizer Repsonsive Table was actually creating a new table element when viewed on a mobile browser.
To work around this, I created a test page and re-designed the form using
This resolved the issue with the form submit button not working on a mobile browser.
Unfortunately, it brought to light a new issue. The new form does not resize to the correct width specified in CSS which is 75% of the viewing portal when displaying on a mobile device in portrait mode. It does display full width when viewed in landscape mode on a mobile browser.
I’ve attached screenshots for reference. And the test link for viewing the issue is http://www.event1software.com/this-is-a-test-page
Thanks!
N/M. Found the option buried in the Blog Theme Options.
So I played with the Theme Options a bit trying to find some clue as to why this is occurring and discovered something strange.
When I change the page Theme Option for Sidebar Position to No Sidebar the page still displays the Sidebar, but the content renders properly for portrait view on an Android or iPhone device. The General Theme Option is set for a single side bar, so I guess the added option chosen on the page Theme Option is causing a glitch or something.
Anyways, I consider the matter closed, but thought it was worth mentioning in case it is a bug that needs to be resolved in future releases.
At your request, I have removed the doctype/body/head/html element tags from the page and it is still resizing in portrait mode to landscape width on smart devices.
I have made no manual changes to the theme files with the exception of what was doing using the Custom CSS tool in Theme Options. Pretty sure that is not the issue, but just in case, I’ve copied all the Custom CSS code below for review:
.td-75 {
width=75%;
}
.th-half {
width=50% !important;
text-align: right;
}
.td-half {
width=50% !important;
vertical-align: top;
}
div#leftDiv{
width: 100%
text-align: left;
}
.ul-striped{
padding: 5px;
line-height: 200%;
}
.ul-striped li:nth-child(odd) {
border-bottom: 1px solid black;
background-color: lightgray;
list-style-type: disc !important;
}
.ul-striped li:nth-child(even) {
border-bottom: 1px solid black;
background-color: white;
list-style-type: disc !important;
}
.div-form{
width: 75%;
float: right;
}
.table-form{
background-color: lightgray;
}
.td-formleft{
width: 25%;
}
.input-form{
width: 100%;
padding: 1px !important;
}
.input-half{
width: 50%;
}
input.required{
width: 100%;
padding: 1px !important;
border-style: solid !important;
border-color: red !important;
border-width: thin !important;
}
textarea.required{
width: 100%;
padding: 1px !important;
border-style: solid !important;
border-color: red !important;
border-width: thin !important;
}