Taimoor Ahmed
Taimoor Ahmed

Reputation: 11

How to make this iframe code responsive

Hi I want to make fix this iframe into the center between the left table and right table. I'm having trouble with making my site responsive and it appears different on different resolutions: (http://footkick.16mb.com/)

As I said, I wanted this to be bang in the center of the left and right table regardless of resolution. If you can help me out: THANKS SO MUCH

[<]iframe class="channels" src="http://www.bbc.co.uk/sport/football/fixtures" scrolling="yes" style="height: 990px; width: 619px;margin: 45px 0px 0px 115px; border:2px solid black; outline-style: solid; outline-color: green; ">

css:

height: 990px;
width: 619px;
margin: 45px 0px 0px 115px;
border: 2px solid black;
outline-style: solid;
outline-color: green;

Upvotes: 0

Views: 119

Answers (3)

user7696252
user7696252

Reputation:

turn the iframe to a block element like so

  .your-frame {
 display: block;
width: 80%;
margin: 2% auto;
}

Upvotes: 0

Jethro Hazelhurst
Jethro Hazelhurst

Reputation: 3285

On your Iframe element remove: margin: 45px 0px 0px 115px; and add margin: 0 auto; display:block;.

Display block:

Margin: 0 auto

Also please learn about why inline css is a bad practice

Upvotes: 0

lumio
lumio

Reputation: 7575

Try adding this to your CSS:

margin: 45px auto 0px;
display: block

Upvotes: 0

Related Questions