Center big image in smaller div

Posted by larin555 on Stack Overflow See other posts from Stack Overflow or by larin555
Published on 2012-11-18T22:57:11Z Indexed on 2012/11/18 22:59 UTC
Read the original article Hit count: 203

Filed under:

css

I'm trying to align images in the center of a slider div. I'm adjusting FlexSlider css by the way. Here's my CSS code :

.flexslider {margin: 0; padding: 0; width: 600px; height:480px; overflow:hidden;margin-left:auto;margin-right:auto;}
.flexslider .slides > li {display: none; -webkit-backface-visibility: hidden;} /* Hide the slides before the JS is loaded. Avoids image jumping */
.flexslider .slides img {width:auto;height:100%; display: inline-block; text-align:center;}

Everything is working like I want, except that I want wider image to be centered in the div. Right now it is left-aligned. I cannot use background-image by the way. Any ideas?

I also tried applying to the .flexslider .slides img :

margin-left:-50%...not working margin-left:auto and margin-right:auto...not working left:50% and right:50%...not working either

Related posts about css

HTMLUNIT Facebook javascript warning

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi I am trying to create simple application that would be able to search people on facebook using given e-mail. I am already able to log into an account using the HTMLunit tool and even create a page, which should throw result of my search. But when I try to print the result as XML the file is missing… >>> More
$this->headLink() includes duplicated script

as seen on Stack Overflow - Search for 'Stack Overflow'
Hi, Just like I did before, I used the following code for my new project. <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/button.css');?> <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/inputText.css');?> <?=$this->headLink()->appendStylesheet('/Layouts/admin/css/fancyTable… >>> More
How much multiple style sheets slow down to website?

as seen on Stack Overflow - Search for 'Stack Overflow'
Here is 3 css file (one is only for IE) <link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection"> <link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print"> <!--[if lt IE 8]><link rel="stylesheet" href="css/blueprint/ie… >>> More
mod_pagespeed is rewriting but not combining

as seen on Stack Overflow - Search for 'Stack Overflow'
I have the following problem. I installed mod_pagespeed but i am not getting the results i want! It does rewrite my css and changes the to the cache url but its not combining the css files. I have seached the web and stackoverflow for it but did not find a solution. Here are the tags <link… >>> More
CSS import or multiple CSS files

as seen on Stack Overflow - Search for 'Stack Overflow'
I originally wanted to include a .css in my HTML doc that loads multiple other .css files in order to divide up some chunks of code for development purposes. I have created a test page: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional… >>> More

Developer IT

Center big image in smaller div - Developer IT

Center big image in smaller div

css

Related posts about css

HTMLUNIT Facebook javascript warning

$this->headLink() includes duplicated script

How much multiple style sheets slow down to website?

mod_pagespeed is rewriting but not combining

CSS import or multiple CSS files

Categories cloud