CODEWITHSUNDEEP
iphoneiosipadwebview
user2282932
user2282932

Reputation: 89

How do I center the contents of a webview in iOS vertically and horizontally?

I have googled quite a bit and I can't seem to find anything that makes sense to me. I need to center the contents of a webview both vertically and horizontally. I have been able to get the horizontal to work with this:

- (void)webViewDidFinishLoad:(UIWebView *)webView {
    NSString *bodyStyle = @"document.getElementsByTagName('body')[0].style.textAlign = 'center';";
    [self.webView stringByEvaluatingJavaScriptFromString:bodyStyle];
}

But I can't find anything on vertical. Any ideas? Any help would be appreciated.

Upvotes: 4

Views: 9318

Answers (3)

Maq
Maq

Reputation: 399

Vertical centering:

CGSize contentSize = webView.scrollView.contentSize;
CGFloat d = contentSize.height/2 - webView.center.y;
[webView.scrollView setContentOffset:CGPointMake(0, d) animated:NO];

Upvotes: 2

Venk
Venk

Reputation: 5955

Try like this,

NSString *bodyStyleVertical = @"document.getElementsByTagName('body')[0].style.verticalAlign = 'middle';";
NSString *bodyStyleHorizontal = @"document.getElementsByTagName('body')[0].style.textAlign = 'center';";
NSString *mapStyle = @"document.getElementById('mapid').style.margin = 'auto';";

[webView stringByEvaluatingJavaScriptFromString:bodyStyleVertical];
[webView stringByEvaluatingJavaScriptFromString:bodyStyleHorizontal];
[webView stringByEvaluatingJavaScriptFromString:mapStyle];

Hope it will helps you.....

Upvotes: 2

karim
karim

Reputation: 15599

Keep everything in a table and then align the table cells.

CSS

td {
    text-align: center;
    vertical-align: middle;
}

or 

<table border="1">
    <tr>
        <td align="center" valign="middle">Text</td>
        <td align="center" valign="middle">Text</td>
    </tr>
</table>

Upvotes: 2

Related Questions