Become a MacRumors Supporter for $50/year with no ads, ability to filter front page stories, and private forums.

Starhorsepax

macrumors member
Original poster
Jun 6, 2010
75
4
Does anyone know how to do this? I had to use deprecated code to get it to center. I've tried div class center. But it's not working. :confused:
 

angelwatt

Moderator emeritus
Aug 16, 2005
7,852
9
USA
Generally you do it the same as with other elements: margin: 0 auto; If that's not working, show the HTML/CSS you're working with and we might be able to offer something more specific.
 

elppa

macrumors 68040
Nov 26, 2003
3,233
151
iframes display inline by default.

So if you are going with margin: auto; you will need to add display: block; as well.

Also for auto margins to work an explicit width must be set on the iframe.

This should work:
Code:
iframe {
    display: block;
    width: 800px;
    height: 400px;
    margin: 0 auto;
    border: 0;
}

Code:
<iframe src="http://www.apple.com/"></iframe>
 
Last edited:

Starhorsepax

macrumors member
Original poster
Jun 6, 2010
75
4
iframes display inline by default.

So if you are going with margin: auto; you will need to add display: block; as well.

Also for auto margins to work an explicit width must be set on the iframe.

This should work:
Code:
iframe {
    display: block;
    width: 800px;
    height: 400px;
    margin: 0 auto;
    border: 0;
}

Code:
<iframe src="http://www.apple.com/"></iframe>

THANK YOU! :eek: That worked!
 

George Florida

macrumors newbie
Feb 20, 2013
1
0
iframes display inline by default.
So if you are going with margin: auto; you will need to add display: block; as well.
Also for auto margins to work an explicit width must be set on the iframe.
This should work:
Code:
iframe {
    display: block;
    width: 800px;
    height: 400px;
    margin: 0 auto;
    border: 0;
}
Code:
<iframe src="http://www.apple.com/"></iframe>
Many thanks, Elppa, for the great AND COMPLETE WITH COMPLETE CODE reply that worked, instead of posting the incomplete, condescending and arrogant reply immediately prior to yours.

When we ask for advice, it's not to be told by implication, "Hey, dummy, you should know enough that generally you do it the same as with other elements: margin: 0 auto."

If we KNEW that much, we wouldn't be here asking for decent, complete and applicable information. No one is asking for implied insults. In the future, angelwatt, save yourself the time and bandwidth by not posting such useless and pedantic crap, and take a lesson from Elppa about how an information forum is supposed to work in sharing USEFUL information instead of trying to impress others with your useless prowess.

We don't care what you know; on specific questions and trouble-shooting, we care about what you know which you are willing to share in detail as a colleague.

(EOM)
 

SrWebDeveloper

macrumors 68000
Dec 7, 2007
1,871
3
Alexandria, VA, USA
......instead of posting the incomplete, condescending and arrogant reply immediately prior to yours. When we ask for advice, it's not to be told by implication, "Hey, dummy.....

You could have been more diplomatic than that - I don't agree with your phrasing, characterization or the need to attack publicly (i.e. maybe next time don't reply at all or repor to a mod) but I do understand your frustration at that point in the thread on the technical stuff, of course. As a long term user and with all due respect to you, I personally ask please try to keep it friendly here and I will do the same. Then it becomes contagious, and that's a forum folks will want to not just visit, but re-visit.

Thank you.
 

dma550

macrumors 6502
Sep 3, 2009
267
4
CT
Many thanks, Elppa, for the great AND COMPLETE WITH COMPLETE CODE reply that worked, instead of posting the incomplete, condescending and arrogant reply immediately prior to yours.

When we ask for advice, it's not to be told by implication, "Hey, dummy, you should know enough that generally you do it the same as with other elements: margin: 0 auto."

If we KNEW that much, we wouldn't be here asking for decent, complete and applicable information. No one is asking for implied insults. In the future, angelwatt, save yourself the time and bandwidth by not posting such useless and pedantic crap, and take a lesson from Elppa about how an information forum is supposed to work in sharing USEFUL information instead of trying to impress others with your useless prowess.

We don't care what you know; on specific questions and trouble-shooting, we care about what you know which you are willing to share in detail as a colleague.

(EOM)

Hmm, I didn't think his post was arrogant. I sometimes don't post entire solutions on code forums just to have the OP get involved in the solution, and, let's face it, not everyone has time to solve someone else's problem in complete fashion, but provide a bump in the right direction.
 

fig

macrumors 6502a
Jun 13, 2012
916
83
Austin, TX
Hmm, I didn't think his post was arrogant. I sometimes don't post entire solutions on code forums just to have the OP get involved in the solution, and, let's face it, not everyone has time to solve someone else's problem in complete fashion, but provide a bump in the right direction.

Completely agree. He offered the basic code that should work and said if it didn't to post the code so we could troubleshoot it. Sounds pretty reasonable to me.

I also sort of wonder what caused our new friend George to use his first and so far only post to angrily comment on an 18 month old thread.
 

SrWebDeveloper

macrumors 68000
Dec 7, 2007
1,871
3
Alexandria, VA, USA
I think newbies often don't notice dates, they're browsing many forums to get the answer to a common issue and usually copy/paste/try many solutions until one works. I do not at all condone what that guy did, nor did anyone who posted code or advice in any way do anything wrong, to be clear. I'm just stating I understand the frustration, I've been there and done that when I was first learning (and I still am learning, all the time). People often lose patience in this fast pace world of get it done, fix it now, get paid, etc. combined with little effort at learning. The Internet is a great resource, but people forget to be civil and that technical forums are bi-directional, both learning and teaching oriented. Some people expect Wikipedia here. That clearly isn't us.

Just some thoughts I wanted to express, I got it out, feel better now. ;)
 

gsilver352

macrumors newbie
Feb 25, 2014
3
0
CSS vs Inline

Is there a way to implement these changes using inline CSS?

Example:

<span style="display: block; width: 800px; height: 400px; margin: 0 auto; border: 0;"><iframe src="http://mypage.com"></iframe></span>

OR something like...

<iframe src="http://mypage.com" height="400" width="800" display="block" frameborder="0" margin="0 auto" marginwidth="0" marginheight="0" scrolling="no"></iframe>

Thank you,
 

elppa

macrumors 68040
Nov 26, 2003
3,233
151
Is there a way to implement these changes using inline CSS?

Example:

<span style="display: block; width: 800px; height: 400px; margin: 0 auto; border: 0;"><iframe src="http://mypage.com"></iframe></span>

OR something like...

<iframe src="http://mypage.com" height="400" width="800" display="block" frameborder="0" margin="0 auto" marginwidth="0" marginheight="0" scrolling="no"></iframe>

Thank you,


Inline CSS isn't a great approach. It seems like you are nearly there though… just add the style attribute directly to the iframe:

Code:
<iframe src="https://bing.com" scrolling="no" 
        style="display: block; width: 800px; height: 400px; margin: 0 auto; border: 0;">
</iframe>
 

Flood123

macrumors 6502a
Mar 28, 2009
624
62
Living Stateside
Inline CSS isn't a great approach.

Couldn't agree more. Typically you want to keep your content, presentation, and behavior separate. While this holds true MOST of the time, this is an old rule and nowadays there are exceptions to this rule. In regards to his needs and example, the rule holds true. It is best practice to keep them separate. You are 100% on the mark.


Great article on the subject.
http://blog.teamtreehouse.com/the-separation-of-structure-presentation-and-behavior-is-dead)
 
Register on MacRumors! This sidebar will go away, and you'll see fewer ads.