locate proper div and how to center on page

  • astephens

    (@astephens)


    9 years ago

    I’m using a blank template created in a web design class.
    https://gracechurchhouston.com/grace/

    Site is nearing completion. Need to center a 3rd party media player (iframe from sermon.net) on the media page. This is the code provided by the service and it works well. I only want to center it on the page where i have it displayed. My problem is trying to determine which div (player, entry, sermonnet) to apply the css to and also what to use for the css to make it centered. I’m not sure what they’ve included in the code that might conflict with any css i create.

    <div class="sermonnet" style="width:640px;max-width:100%;">
<div style="height:896px;padding-bottom:56.25%;-webkit-overflow-scrolling:touch;overflow-y:auto;position:relative;">
<iframe src="https://gracecenterhouston.com/widget/player/13716" name="sermon-frame" frameborder="0" width="100%" height="100%" style="position:absolute;width:1px;min-width:100%;*width:100%;" scrolling="no" allowTransparency="true" allowfullscreen><a href="https://gracecenterhouston.com/widget/player/13716"><p>Your browser does not support iFrames, please click here to access our media center.</p></a> </iframe>
</div>
</div>
Viewing 2 replies - 1 through 2 (of 2 total)
  • Thread Starter astephens

    (@astephens)

    Well i think i just did it by adding:

    .sermonnet  {
	margin: 0 auto;
}

    but now not sure i want it centered for aesthetics because now the responsiveness isn’t going to work for the player as it did when it was on the left side.
    The overall site/template is NOT a responsive template but the player was performing responsive at least enough that it could be seen full when the screen was narrowed across width.
    Any suggestions? otherwise i’ll just put it back to left side.
    Thanks

    Thread Starter astephens

    (@astephens)

    just checked my phone and actually it does look like it’s showing up correctly… so may be ok as it is now.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘locate proper div and how to center on page’ is closed to new replies.