CSS Issue

Discussion in 'CSS' started by lbhabib.ru, Sep 23, 2011.

  1. #1
    I am creating a gallery in WordPress but i am running into a small issue that i can't figure it out.
    When viewing the site on 14" Screen the whole body shifts to the right instead of centering it.


    Here is the link for the gallery and below is the style sheet


    
    /* Reset default browser styles */
    @import url('resets/reset.css');
    
    /* Rebuild default browser styles */
    @import url('resets/rebuild.css');
    
    /* Basic WordPress Styles */
    @import url('resets/wp.css');
    
    /* General Styles
    -------------------------------------------------------------- */
    
    /* The following section sets the basic body, H1-H5 and link styles */
    
    html {
    	height			:	100%;
    }
    
    body {
    	background		: 	url(../images/uploads/pink_stripes.gif) repeat 0 0px #f5dddb;
        padding-top 	: 	0;
    	margin-top 		: 	0;
    	height			:	100%;
    }
    
    h1 { /* The H1 tag is used for page titles */
    	font-size 		: 	24px;
        font-family		:	;
        color			: 	#e3628b;
        padding-bottom	:	15px;
        margin-bottom	:	10px;
        border-bottom	:	1px solid #E1E1E1;
    	clear			:	none;
    			}
    
    h1 a:link, .h1 a:visited {
    	color			: 	#e3628b;
    }
    
    h2 { /* The H2 tag is used for post titles */
    	font-size 		: 	22px;
        font-family		:	;
        color			: 	#e3628b;
    	clear			:	none;
    		}
    
    h2 a:link, .h2 a:visited {
    	color			: 	#e3628b;
    }
    
    h3 {
    	font-size 		: 	18px;
        font-family		:	;
        color			: 	#e3628b;
    	clear			:	none;
    		}
    
    h3 a:link, .h1 a:visited {
    	color			: 	#e3628b;
    }
    
    h4 {
    	font-size 		: 	16px;
        font-family		:	;
        color			: 	#e3628b;
    	clear			:	none;
    		}
    
    h4 a:link, .h4 a:visited {
    	color			: 	#e3628b;
    }
    
    h5 {
    	font-size 		: 	14px;
        font-family		:	;
        color			: 	#e3628b;
    	clear			:	none;
    		}
    
    h5 a:link, .h5 a:visited {
    	color			: 	#e3628b;
    }
    
    a:link,a:visited { /* This styles the majority of the on page links. The sidebar links can be styled seperately */
    	color 			: 	#d1a1ac;
    	text-decoration : 	none;
    }
    
    a:hover,a:active {
    	color 			: 	#ff548d;
    	text-decoration : 	none;
    }
    
    .clear {
    	width			:	100%;
    	clear			:	both;
    	height			:	1px;
    }
    
    
    /* General Page Styles
    -------------------------------------------------------------- */
    
    #main_container {
    	min-height		:	100%;
    	z-index			:	-1;
    	}
    
    #wrapper { /* This sets the width of the entire site */
    	position 		: 	relative;
    	width 			: 	960px;
    	margin 			: 	0 auto;
    	overflow		:	auto;
    	padding-bottom	:	150px;
    }
    
    #container { /* This sets the width of the main content area */
    	float			: 	left;
    	margin			: 	0 0 15px 0;
    	width			: 	900px;
        padding			: 	30px;
    	background		: 	#ffffff;
        border			:	0px solid #CCCCCC;
    }
    
    
    /* Menu Styles
    -------------------------------------------------------------- */
    
    #menu_wrapper { /* This is the main menu container */
    		width 			: 	955px;
    	    margin			: 	30px 0 0 0;
    		float 			: 	right;
    	text-align 		: 	right;
        position		:	absolute;
        	overflow 		: 	visible;
    	padding-top 	: 	22px;
    	    z-index			:	2;
    	}
    
    .menu ul, .menu ul * { /* This sets the width of the menu */
    	list-style		: 	none;
    	margin			: 	0 0 0 0;
    	padding			:	0;
    }
    
    .menu ul { /* This sets the line height of the menu */
    	line-height		:	1.0;
    }
    
    .menu a { /* This controls the font size and position of the main menu links */
    	position		:	relative;
    	display			: 	block;
    	float			: 	left;
        font-size 		: 	12px;
    		text-transform	:	uppercase;
    	}
    
    .menu a:link,.menu a:visited { /* This sets the color and style of the main menu links */
    	display 		: 	inline;
    	float 			: 	none;
    	text-decoration : 	none;
    	color 			: 	#d1a1ac;
        font-family		:	Arial, Helvetica, sans-serif;
    	font-weight 	: 	bold;
    	padding 		: 	22px 17px 12px 17px;
    	background 		: 	transparent;
    }
    
    .menu a:hover,.menu a:active,
    .menu .current_page_item a:link,
    .menu .current_page_item a:visited  { /* This sets the color and style of the hover and active states of the main menu links */
    	color 			: 	#e3628b;
    	background 		: 	transparent;
    }
    
    .menu .current_page_item ul a:link,
    .menu .current_page_item ul a:visited { /* This sets the color and style of the current page item on the main menu links */
    	color 			: 	#e3628b;
    	background 		: 	#FFFFFF;
    }
    
    .menu .current_page_item ul li a:hover,
    .menu .current_page_item ul li a:active { /* This sets the color and style of the hover and active states of the current page item on the main menu links */
    	color 			: 	#e3628b;
    	background 		: 	#FFFFFF;
    }
    
    .menu ul li { /* This sets the position of the main menu items */
    	position		:	relative;
    	display			: 	inline;
        margin			:	0 0 0 0;
    }
    
    .menu ul li { /* This sets the position of the custom main menu items */
    	position		:	relative;
    	display			: 	inline;
        margin			:	0 -3px 0 0;
    }
    
    .menu ul li:hover {
    	visibility		:	inherit; /* fixes IE7 'sticky bug' */
    }
    
    .menu ul li ul { /* This sets the position of the dropdown menu */
    	display			:	block;
    	visibility		:	hidden;
        position		:	absolute;
    	top				:	-999em;
        margin			:	0 0 0 0;
    	width			:	10em; /* left offset of submenus need to match (see below) */
        border-top		:	2px solid #e3628b;
    }
    
    .menu ul li:hover ul,
    .menu ul li ul { /* This sets the position and z-index of the dropdown menu */
    	left			:	0;
    	top				:	2.2em; /* match top ul list item height */
    	z-index			:	99;
    }
    
    .menu ul li ul li { /* This sets the size and transparency of the dropdown items */
    	display 		: 	block;
    	width			:	100%;
    	filter			:	alpha(opacity=90);
    	opacity			: 	0.90;
    	-moz-opacity	:	0.90;
        margin			:	0;
    }
    
    .menu ul li ul li a:link,
    .menu ul li ul li a:visited,
    .menu ul li.current_page_item ul li a:link,
    .menu ul li.current_page_item ul li a:visited { /* This sets the color and style of the drop down menu links */
    	display 		: 	block;
    	padding 		: 	5px;
    	text-align 		: 	left;
    	color 			: 	#c6869a;
    	background 		: 	#eeeadf;
        font-size 		: 	12px;
        font-family		:	Arial, Helvetica, sans-serif;
    		text-transform	:	uppercase;
    	}
    
    .menu ul li ul li a:hover,
    .menu ul li ul li a:active,
    .menu ul li.current_page_item ul li a:hover,
    .menu ul li.current_page_item ul li a:active,
    .menu ul li ul li.current_page_item a:link,
    .menu ul li ul li.current_page_item a:visited { /* This sets the color and style of the hover, active & current states of the drop down menu links */
    	color 			: 	#e3628b;
    	background 		: 	#ffffff;
    }
    
     /* The remaining items below are essential positioning styles for the menus */
    
    .menu ul li:hover li ul,
    .menu ul li li ul {
    	top				:	-999em;
    }
    
    .menu ul li li:hover ul,
    .menu ul li li ul {
    	left			:	10em; /* match ul width */
    	top				:	0;
    }
    
    .menu ul li li:hover li ul,
    .menu ul li li li ul {
    	top				:	-999em;
    }
    
    .menu ul li li li:hover ul,
    .menu ul li li li ul {
    	left			:	10em; /* match ul width */
    	top				:	0;
    }
    
    .footer_menu { /* This sets the z-index of the footer menu */
        z-index			:	2;
    }
    
    .footer_menu ul, .footer_menu ul * { /* This sets the width of the footer menu */
    	overflow 		: 	visible;
        z-index			:	2;
        list-style		: 	none;
        margin			:	0 auto;
    	padding			:	0;
    }
    
    .footer_menu ul li { /* This sets the position of the footer menu items */
    	position		:	relative;
    	display			: 	inline;
        margin			:	0 7px 0 7px;
        font-weight		:	bold;
    }
    
    
    /* Header Styles
    -------------------------------------------------------------- */
    
    #header { /* This sets the color of the header */
    	background		:	url(../images/uploads/header_fadepink.gif) bottom repeat-x #FFFFFF;
        	width			: 	100%;
    	    height			:	120px;
        margin-bottom	:	10px;
    }
    
    #masthead { /* This sets total width and position of the header */
        width			:	960px;
        margin			:	0 auto;
    }
    
    #branding { /* This sets the size and position of the logo area on the header */
        display			:	block;
    		float 			: 	left;
        margin			:	0;
    	position		:	relative;
    		width 			: 	400px;
    	    z-index			:	3;
            padding			:	25px 0 10px 0;
    }
    
    #branding a { /* This sets the color and style of the wordpress title */
        text-decoration	:	none;
    }
    
    #branding h1 { /* This sets the color of the wordpress title */
    	font-size		:	24px;
        font-family		:	helvetica, arial, sans-serif;
    	color			: 	#333333;
    	line-height		:	26px;
        border			:	0;
    	margin-top		:	15px;
        margin-bottom	:	5px;
        padding			:	0;
    		text-align		:	left;
    			text-transform	:	none;
    		}
    
    #branding .description { /* This sets the font size and color for the description line if you are using the Wordpress title and description */
    	font-size		:	12px;
        font-family		:	helvetica, arial, sans-serif;
    	color			: 	#666666;
    		margin-left		:	5px;
    		}
    
    
    /* Content Styles
    -------------------------------------------------------------- */
    
    #content { /* This sets the width of the page content area  */
    	position		:	relative;
        margin			: 	0;
    	width			:	100%;
        z-index			:	1;
    }
    
    #content-sm { /* This sets the width of the blog content area  */
    	width			:	98%;
        float			:	left;
        padding-right	:	2%; /* IMPORTANT! Sets a small margin between the blog content and the sidebar  */
    }
    
    #content, #content-sm { /* This sets the font size and style on the blog and pages  */
    	color 			: 	#000000;
        font-size		: 	14px;
        font-family		:	"Times New Roman", Times, serif;
    }
    
    #content p, #content-sm p { /* This sets the paragraph spacing and line height  */
        line-height		: 	20px;
    	margin-bottom	: 	10px;
    }
    
    .post { /* This sets a small margin at the bottom of posts  */
    	margin			: 	0 0 3em 0;	
    }
    
    .entry-content, .entry-summary { /* This sets a small margin at the top of the post content to make space between the title/meta area  */
    	margin			: 	1.5em 0 0 0;
    }
    
    blockquote { /* This styles blockquotes in blog posts  */
    	border-left		:	2px solid #E1E1E1;
    	margin-left		:	25px;
    	padding-left	:	15px;
    }
    
    
    /* Post Styles
    -------------------------------------------------------------- */
    
    .navigation { /* This sets a small margin below the post navigation on a single post */
    	margin			: 	0 0 1.5em 0;
    	overflow		: 	auto;	
    }
    
    .size-full,
    .entry-content img { /* This sets a border around images in posts */
    	border 			: 	5px solid #e8e7e7;
    }
    
    .entry-meta,
    .entry-utility { /* This sets the font size and style on post meta. This is the date, post by and comment links below the post title. */
    	color 			: 	#000000;
        font-size		: 	14px;
        font-family		:	"Times New Roman", Times, serif;
    	font-style 		: 	italic;
    	clear 			: 	both;
    }
    
    
    /* Post Comment Styles
    -------------------------------------------------------------- */
    
    .comments ol { /* This removes the numbers from the comment list */
    	list-style		:	none;	
        margin-top		:	10px;
    }
    
    .comments li { /* This clears each comment block to a new line and adds a margin */
    	width			:	100%;
        clear			:	both;
        min-height		:	100px;
    }
    
    .comments ul.children { /* This clears each comment block to a new line and adds a margin */
    	list-style		:	none;
    	margin-top		:	30px;
    }
    
    .comments .comment-wrapper { /* This sets the style for the comment wrapper */
    	display			:	block;
    }
    
    .comments .comment-author { /* This sets the style for the comment author icon */
    	float			:	left;
        width			:	15%;
        margin-right	:	2%;
    }
    
    .comments .content-wrapper { /* This sets the style for the comment meta and content */
    	float			:	left;
        width			:	83%;
    }
    
    .comments .comment-content { /* This sets a small margin between the meta and comment content */
    	margin-top		:	5px;
    }
    
    span.unapproved {
    	font-style 		: 	italic;
    }
    
    img.wp-smiley{  /* This sets no border around smileys */
    	border			:	none;
    }
    
    
    /* Sidebar Styles
    -------------------------------------------------------------- */
    
    #sidebar { /* This sets the size of the sidebar as well as the font size and style */
    	float			:	right;
    	width			: 	0%;
        background		:	#eeeadf;
        text-align		:	center;
        color			:	#858085;
        font-size		:	12px;
        font-family		:	"Times New Roman", Times, serif;
    }
    
    #sidebar a { /* This sets the color of the sidebar links */
        color			:	#c6869a;
    }
    
    #sidebar a:hover,
    #sidebar a:active { /* This sets the color and style of the hover and active states of the sidebar links */
        color			:	#e3628b;
        text-decoration	:	none;
    }
    
    #sidebar .social-media { /* This sets the padding of the social media icons in the sidebar */
        text-align		:	left;
        padding			:	10px 10px 5px 10px;
    }
    
    #sidebar .social-media img { /* This sets a small margin to the right of each of the social media icons */
        border			:	0;
        margin-right	:	5px;
    }
    
    #primary, #primary_custom { /* This sets the position and width of the widget area */
    	float			: 	right;
    	overflow		: 	hidden;
    	width 			: 	94%;
        padding			:	3%;
        text-align		:	left;
    }
    
    .widget-title,.widgettitle { /* This sets the size and style of the sidebar titles */
    	font-size 		: 	14px;
    	font-weight 	: 	bold;
        font-family		:	Arial, Helvetica, sans-serif;
    	color 			: 	#c6869a;
    	text-transform 	: 	uppercase;
    	margin-bottom 	: 	10px;
    	padding-bottom 	: 	0;
    }
    
    .widget-container { /* This sets a small margin below each widget */
    	margin			: 	0 0 1.5em 0;
    }
    
    #searchform label { /* This hides the search form label */
    	display 		: 	none;
    }
    
    /* The following style the lists in the widgets */
    
    .widget-area ul {
    	list-style		: 	none;
    	margin-left		: 	0;
    }
    
    .widget-area ul ul {
    	list-style		: 	disc;
    	margin-left		: 	1.1em;
    }
    
    .widget-area ul ul ul {
    	margin-left		: 	2.5em;
    }
    
    
    /* Gallery Styles
    -------------------------------------------------------------- */
    
    .galleria-info-text {
    }
    
    .galleria-info-title {
    	/*color 			: 	#000000;*/
        font-size		: 	14px;
        font-family		:	"Times New Roman", Times, serif;
    }
    
    .galleria-info-description {
    	/*color 			: 	#000000;*/ 
        font-size		: 	14px;
        font-family		:	"Times New Roman", Times, serif;
    }
    
    .photocrati_nojava {
    	width			:	100%;
    	text-align		:	center;
    	margin			:	0 auto;
    }
    
    .photocrati_nojava img {
    	max-width		:	100%!important;
    	margin			:	5px auto;
    }
    
    .iframe_wrapper {
    	width			:	100%;
    	text-align		:	center;
    }
    
    .gallery {
    	margin-bottom	:	15px;
    }
    
    .gallery img {
    	border			:	0px;
    }
    
    
    /* Album Styles
    -------------------------------------------------------------- */
    
    .album_wrapper {
    	width			:	100%;
    	clear			:	both;
    	margin-bottom	:	15px;
    }
    	
    .album_list .image_wrapper {
    	width			:	25%;
    }
    	
    .album_list .image_wrapper img {
    	max-width		:	90%;
    	max-height		:	148px;
    }
    	
    .album_list .meta_wrapper {
    	width			:	75%;
    }
    
    
    /* E-Commerce Gallery Styles
    -------------------------------------------------------------- */
    
    .ecommerce_wrapper {
    	width			:	100%;
    	height			:	auto;
    	postition		:	relative;
    	margin-bottom	:	10px;
    	clear			:	both;
    }
    
    .ecommerce {
    	float			:	left;
    	text-align		:	center;
    }
    	
    .ecommerce .meta_wrapper .quantity {
    	width			:	40%;
    	float			:	left;
    }
    	
    .ecommerce .meta_wrapper .quantity input {
    	padding			:	3px;
    	border			:	1px solid #999;
    	font-size		:	11px;
    }
    	
    .addto {
    	width			:	100%;
    	float			:	right;
    	text-align		:	right;
    }
    	
    .addto a, a.iframe {
    	text-decoration	:	none;
    }
    
    .addto button, button.addto, button#addto, button#addto2, button#addto3 {
        display			:	block;
    	width			:	auto;
        overflow		:	visible;
        float			:	right;
        margin			:	2px 0 0 0;
    	background		:   #CCCCCC url(../images/button-overlay.png) repeat-x;
        border			:	1px solid #999999;
        font-family		:	"Lucida Grande", Tahoma, Arial, Verdana, sans-serif;
        font-size		:	11px;
        line-height		:	130%;
        text-decoration	:	none;
        font-weight		:	bold;
        color			:	#333333;
        cursor			:	pointer;
        padding			:	3px 5px; /* Links */
    	-moz-border-radius	: 	8px;
    	border-radius	: 	8px;
    }
    
    button#addto2 {
        padding			:	5px 5px 5px 22px; /* Links */
    }
    
    .addto button img, button#addto2 img {
        border			:	0;
    	clear			:	none;
    	position		:	absolute;
    	margin-left		:	-17px;
    }
    
    .addto img {
        margin			:	0 3px -1px 0 !important;
        padding			:	0;
        border			:	none;
    	cursor			:	pointer;
    }
    
    
    /* E-Commerce Add to Cart Window
    -------------------------------------------------------------- */
    
    #cart_wrapper {
    	width			:	98%;
    }
    
    .cart_header {
    	width			:	100%;
    	padding			:	3px 6px;
    	background		:	#F1F1F1;
    	color			:	#333333;
    	font-size		:	13px;
    	border			:	1px solid #CCCCCC;
    	border-left		:	0;
    	border-right	:	0;
    }
    
    .cart_image {
    	width			:	30%;
    	float			:	left;
    }
    
    .cart_image img {
    	max-width		:	173px;
    	border			:	1px solid #CCCCCC;
    }
    
    .cart_data {
    	width			:	70%;
    	float			:	left;
    	font-size		:	13px;
    }
    
    .cart_qty, .cart_desc, .cart_amt, .cart_line {
    	float			:	left;
    	margin			:	2px 0;
    	height			:	30px;
    	font-size		:	12px;
    }
    
    .cart_qty {
    	width			:	15%;
    }
    
    .cart_qty input {
    	width			:	35px;
    	padding			:	2px;
    	border			:	1px solid #CCCCCC;
    	font-size		:	12px;
    }
    
    .cart_desc {
    	width			:	49%;
    	padding-top		:	5px;
    }
    
    .cart_amt {
    	width			:	18%;
    	padding-top		:	5px;
    }
    
    .cart_line {
    	width			:	18%;
    	padding-top		:	2px;
    }
    
    .cart_line input {
    	width			:	55px;
    	border			:	0;
    	padding			:	0;
    	font-size		:	12px;
    }
    
    .cart_clear {
    	border-bottom	:	1px solid #CCCCCC;
    	margin-bottom	:	6px;
    }
    
    .cart_total {
    	width			:	82%;
    	font-weight		:	bold;
    	float			:	left;
    	padding-top		:	3px;
    	font-size		:	12px;
    }
    
    .cart_total_amount {
    	width			:	18%;
    	float			:	left;
    	font-size		:	12px;
    }
    
    .cart_total_amount input {
    	width			:	55px;
    	border			:	0;
    	padding			:	0;
    	font-size		:	12px;
    }
    
    .titles {
    	height			:	22px;
    	padding-top		:	5px;
    	color			:	#333333;
    	background		:	#F1F1F1;
    	border			:	1px solid #CCCCCC;
    	border-left		:	0;
    	border-right	:	0;
    }
    
    .buttons_clear {
    	height			:	20px;
    }
    
    .widget_wrapper {
    	width			:	100%;
    	height			:	28px;
    	clear			:	both;
    	position		:	relative;
    	top				:	-5px;
    }
    
    #cart_widget {
    	float			:	right;
    	font-size		:	12px;
    }
    
    #cart_widget p {
    	margin			:	2px 5px 0 0;
    }
    
    
    /* E-Commerce Shopping Cart Page
    -------------------------------------------------------------- */
    
    #shopping_cart_wrapper {
    	width			:	100%;
    	margin			:	5px auto;
    }
    
    #shopping_cart_wrapper .buttons {
    	width			:	100%;
    	text-align		:	right;
    	margin			:	0 auto;
    	padding-bottom	:	25px;
    }
    
    #shopping_cart_wrapper .cart_contents {
    	width			:	100%;
    	clear			:	both;
    	margin			:	10px 0;
    }
    
    #shopping_cart_wrapper .item_wrapper {
    	width			:	100%;
    	clear			:	both;
    	margin			:	5px 0;
    	padding			:	5px 0 10px 0;
    	border-bottom	:	1px dashed #CCCCCC;
    	height			:	auto;
    	overflow		: 	auto;
    }
    
    #shopping_cart_wrapper .cart_contents .cart_image {
    	width			:	25%;
    	float			:	left;
    }
    
    #shopping_cart_wrapper .cart_contents .cart_image img {
    	max-height		:	148px;
    	border			:	1px solid #CCCCCC;
    }
    
    #shopping_cart_wrapper .cart_contents .cart_items {
    	width			:	75%;
    	float			:	left;
    }
    
    #shopping_cart_wrapper .cart_contents .cart_qty,
    #shopping_cart_wrapper .cart_contents .cart_desc,
    #shopping_cart_wrapper .cart_contents .cart_amt,
    #shopping_cart_wrapper .cart_contents .cart_line {
    	height			:	25px;
    	font-size		:	13px;
    }
    
    #shopping_cart_wrapper .cart_contents .cart_qty {
    	width			:	8%;
    	padding-top		:	0;
    }
    
    #shopping_cart_wrapper .cart_contents .cart_desc {
    	width			:	70%;
    	padding-top		:	0;
    }
    
    #shopping_cart_wrapper .cart_contents .cart_amt {
    	width			:	11%;
    	padding-top		:	0;
    }
    
    #shopping_cart_wrapper .cart_contents .cart_line {
    	width			:	11%;
    	padding-top		:	0;
    	font-weight		:	bold;
    	text-align		:	right;
    }
    
    #shopping_cart_wrapper .cart_contents .titles {
    	height			:	20px;
    	padding-top		:	2px;
    }
    
    #shopping_cart_wrapper .cart_total_wrapper {
    	width			:	260px;
    	padding			:	10px;
    	float			:	right;
    	clear			:	both;
    	border			:	1px solid #CCCCCC;
    	background		:	#F1F1F1;
    	color			:	#333333;
    }
    
    #shopping_cart_wrapper .cart_total_wrapper .cart_total {
    	width			:	58%;
    	font-weight		:	bold;
    	float			:	left;
    	padding-top		:	3px;
    	font-size		:	13px;
    	text-align		:	right;
    }
    
    #shopping_cart_wrapper .cart_total_wrapper .cart_total_amount {
    	width			:	42%;
    	float			:	left;
    	font-size		:	13px;
    	font-weight		:	bold;
    	text-align		:	right;
    }
    
    #shopping_cart_wrapper .cart_total_wrapper .cart_total_amount input {
    	width			:	60px;
    	border			:	0;
    	padding			:	0;
    	font-size		:	13px;
    	text-align		:	right;
    	font-weight		:	bold;
    	color			:	#333333;
    	background		:	#F1F1F1;
    }
    
    .checkout_fields {
    	display			:	none;
    	width			:	100%;
    	clear			:	both;
    	padding			:	10px 0;
    	text-align		:	center;
    }
    
    .checkout_fields .checkout_wrapper {
    	width			:	65%;
    	min-height		:	300px;
    	clear			:	both;
    	margin			:	0 auto;
    	padding			:	15px;
    	text-align		:	left;
    }
    
    .checkout_fields .checkout_wrapper .lable {
    	width			:	30%;
    	float			:	left;
    	font-weight		:	bold;
    	margin-bottom	:	10px;
    }
    
    .checkout_fields .checkout_wrapper .field {
    	width			:	70%;
    	float			:	left;
    	text-align		:	right;
    	margin-bottom	:	10px;
    }
    
    .checkout_fields .checkout_wrapper .field input {
    	width			:	350px;
    }
    
    .checkout_fields .checkout_wrapper .field input,
    .checkout_fields .checkout_wrapper .field select {
    	padding			:	3px;
    	border			:	1px solid #CCCCCC;
    	font-size		:	13px;
    }
    
    .checkout_footer {
    	width			:	100%;
    	clear			:	both;
    	padding			:	0 0 15px 0;
    	font-size		:	12px;
    	text-align		:	justify;
    }
    
    .checkout_image {
    	width			:	100%;
    	clear			:	both;
    	padding			:	10px 0 0 0;
    	text-align		:	right;
    }
    
    
    /* Footer Wrapper
    -------------------------------------------------------------- */
    
    .footer_wrapper { /* This sets the size and font styles of the footer area */
    	clear			: 	both;
    		width			: 	100%;
    		text-align 		: 	center;
    	padding			:	5px 0 5px 0;
    	background		:	#FFFFFF;
    	margin-top		:	-150px;
    	height			:	150px;
    	clear			:	both;
    	z-index			:	2;
    	position		:	relative;
    }
    
    
    /* Footer Widget Styles
    -------------------------------------------------------------- */
    
    .footer-widget-area { /* This is the footer widget wrapper */
    	display			:	inline-block;
    	background		:	none;
    	width			:	980px;
        min-height		:	50px;
        color			:	#333333;
        font-size		:	12px;
        font-family		:	Georgia, \\;
    	margin			:	0 auto;
    }
    
    .footer-widget-container { /* This is the footer widget container */
    	display			:	inline-block;
    	background		:	none;
        height			:	auto;
        float			:	left;
    	padding			:	10px;
    	text-align		:	left;
    	margin-bottom	:	5px;
    }
    
    .footer-widget-container .widget-title { /* This sets the style of the footer widget titles */
        font-size		:	16px;
        font-family		:	'Yanone Kaffeesatz', serif;
    	color			:	#d1a1ac;
    }
    
    .footer-widget-container a { /* This sets the color of the footer widget links */
        color			:	#d1a1ac;
    }
    
    .footer-widget-container a:hover,
    .footer-widget-container a:active { /* This sets the color and style of the hover and active states of the footer widget links */
        color			:	#d1a1ac;
        text-decoration	:	none;
    }
    
    
    /* Footer Style
    -------------------------------------------------------------- */
    
    #footer { /* This sets the size and font styles of the footer area */
    	clear			: 	both;
    	width			: 	960px;
    	text-align 		: 	right;
    	margin			:	15px auto 15px auto;
    	padding-top 	: 	5px;
        border-top		:	1px solid #e8e7e7;
    	color 			: 	#333333;
        font-size		: 	12px;
        font-family		:	Georgia, \\;
    }
    
    #footer a { /* This sets the color of the footer links */
        color			:	#d1a1ac;
    }
    
    #footer a:hover,
    #footer a:active { /* This sets the color and style of the hover and active states of the footer links */
        color			:	#d1a1ac;
        text-decoration	:	none;
    }
    
    #footer #site-info {
    	clear			: 	both;
    	margin			:	5px 7px 0 7px;
    }
    
    #footer #site-info p {
    	z-index			:	3;
    }
    
    
    /* Custom CSS Code
    -------------------------------------------------------------- */
    
    div.slideshow {
    margin-bottom: 20px;
    }
    
    #primary {
    padding:25px 23px;
    width:79%;
    }
    PHP:

     
    lbhabib.ru, Sep 23, 2011 IP
  2. workingsmart

    workingsmart Well-Known Member

    Messages:
    411
    Likes Received:
    12
    Best Answers:
    9
    Trophy Points:
    120
    #2
    The physical size of the screen has nothing to do with the RESOLUTION ( PIXELS, DIMENSIONS, ASPECT RATIO ) of the display area.

    In order to help you, we need the resolution at which you are viewing the site in.
     
    workingsmart, Sep 23, 2011 IP
  3. lbhabib.ru

    lbhabib.ru Active Member

    Messages:
    97
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    53
    #3
    Well resolution really is not the case because even on my laptop (1366 X 768) and below is showing just perfect but when i hold Ctrl + Scroll up & down with mouse the gallery shifts to the right side and is no longer in the center.

    I have other website using the same gallery http://gallery.tsvetcoff.com/ but it is always in the center.

    Now the reason that I am saying this is because the client has called me and saying the gallery is not centered. They are using 24'' screen not 14 sorry about that and res 1920x1200 attached is the screen shot they sent me


    Untitled-1.jpg
     
    lbhabib.ru, Sep 23, 2011 IP
  4. workingsmart

    workingsmart Well-Known Member

    Messages:
    411
    Likes Received:
    12
    Best Answers:
    9
    Trophy Points:
    120
    #4
    Regardless of PHYSICAL SIZE - it's all about resolution..... I can have a 32" monitor set to 800x600 dpi thus proving that screen size has nothing to do with resolution.

    Now your issue is margin/position related in your css.

    If you are +/- to zoom in or out and things don't adjust relatively then something related to your CSS is not correct, whether it be % of margin, position relative ( top: xx / left: xx ) <== For example...

    It's all in your CSS.... You will have to review...
     
    workingsmart, Sep 24, 2011 IP
  5. lbhabib.ru

    lbhabib.ru Active Member

    Messages:
    97
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    53
    #5
    I know it is the CSS that is why i posted it here. I also included the css file. Can some one please point out where i went wrong?
     
    lbhabib.ru, Sep 24, 2011 IP
  6. intz

    intz Greenhorn

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    16
    #6
    Hey


    Remove the overflow: auto; from #wrapper selector. That should work.

    #wrapper { /* This sets the width of the entire site */
    position : relative;
    width : 960px;
    margin : 0 auto;
    overflow : auto;
    padding-bottom : 150px;
     
    intz, Sep 24, 2011 IP
  7. lbhabib.ru

    lbhabib.ru Active Member

    Messages:
    97
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    53
    #7
    Thank you it worked :)
     
    lbhabib.ru, Sep 24, 2011 IP
  8. intz

    intz Greenhorn

    Messages:
    36
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    16
    #8
    You're welcome
     
    intz, Sep 24, 2011 IP