or Create a profile
Electric Mobile Studio - Problems →
12 Jul, 2016 04:47 PM
I am using bootstrap with their grid system combined with @media rules in CSS to control the padding on screen breaks.
The structure is a two columns display defined as col-md-4, right hand and col-md-8, left hand. To centre and "squeeze" the columns, we define padding such that there is a 15% padding on the left hand side of the left column and a 15% padding on the right of the right column.. This displays perfectly in conventional browsers, however on the electric studio ipad simulation the padding is screwed up on the right column and the padding is switched. The developer tools show that the render has ignored all the media rules and somehow implemented the column break for screens over 768px? We have a break at 991px wide.
The html is
<div class="row" id="PnlProfile">
<div class="col-md-4 pnlprofl">
<uc2:CitrusLiteralService ID="LitAssocSummHdr" runat="server" />
<uc3:CitrusAssociatesList ID="CitAssocList" runat="server" />
<div class="col-md-8 pnlprofr">
<asp:Image ID="ImgProfImg" CssClass="img-responsive" runat="server" />
<asp:Literal ID="LitAssociateName" runat="server"></asp:Literal>
<asp:Literal ID="LitAssociateTitle" runat="server"></asp:Literal>
<asp:Literal ID="LitAssociateBio" runat="server"></asp:Literal>
The output on the render display for developer tools on the ipad simulation is shown in the attached image
Formatting help /
(switch to plain text)
(switch to Markdown)
You can attach files up to 10MB
If you don't have an account yet, we need to confirm you're human and not a machine trying to post spam.
A conversation has been started with the Electric Plum staff to resolve this discussion.
This discussion is private.
Only you and Electric Plum support staff can see and reply to it.
This discussion is public. Everyone can see and reply to it.
You can use Command ⌘ instead of Control ^ on Mac
Powered by Tender™.