So, I'm trying to center my iframe and every tutorial I've looked up so far hasn't worked. I know it sounds stupid that I can't do it, but I'm having trouble with it  Here's the code I have:

Code:

<style>
iframe{
  align: center !important;
  position: center !important;
}
</style>

<iframe src="http://apps.pixlr.com/editor/" width="1500" height="600" frameborder="0" ></iframe>


I tried putting it in a table, and a ton of other things. But it just doesn't want to center  I also tried it as a simple HTML file off my website and it doesn't work, so it's not something on my website.

have u tried wrapping the iframe with <center> </center> tags

_Twisted_Mods_ wrote:have u tried wrapping the iframe with <center> </center> tags

Yes, still no difference

well y im already on ur forum wheres this iframe located?

Code:

<center><iframe src="http://apps.pixlr.com/editor/" width="1500" height="600" frameborder="0" ></iframe></center>

If you want to center an element with CSS use margin:0 auto; or margin:auto;
( note : that the element should be block-level )

Code:

iframe {
  margin:0 auto;
  display:block;
}

Now if you wanted to center the content inside another element, you can use text-align:center;

HTML :

Code:

<div class="center">
  <iframe src="/null"></iframe>
</div>

and CSS :

Code:

.center { text-align:center }

Thank you all so much all your help. I figured out the problem. (At least I think, it works now.) I made the width too long for the link so it just didn't carry on and so when I centered it it was centering the iframe not the link

And here's the code I ended up with for future viewers (?)

Code:

<style>
.center {
  text-align:center;
  width:100%;
}
iframe{
  width: 1000px;
}
</style>

<div class="center">
 <iframe style="align: center;" src="http://apps.pixlr.com/editor/" width="1500" height="600" frameborder="0"></iframe>
</div>

You're welcome, that will work fine.

By default the <div> element should span the entire width of its parent container, -- similar to 100% width -- because it's a block-level element. This gives a pretty good explanation on block-level and inline elements.