WordPress.org

Ready to get started?Download WordPress

Forums

Changing the position and resize the Graphic Logo Image in Template (5 posts)

  1. makaiman
    Member
    Posted 1 year ago #

    Can anyone help me as soon as possible?

    I am trying to insert a new custom graphic logo inside of a wordpress theme but cannot adjust the logo to shift up and then to the left so it is neatly spaced between the header navigation and the slider images just below. Here is where the logo is:

    http://qislvdev.makaiman.com

    The original graphic logo size was:

    174x50

    I need the new graphic logo to be;

    640x209

    Can anyone help? I can't see where to adjust or change this is the style.css

    Here's the current upper part of the style.css:

    [ Moderator Note: Please post code or markup snippets between backticks or use the code button. there is actually no need to post the css as this is easily accessible from the link to your site.]

    --*/
    @import url(http://fonts.googleapis.com/css?family=Oswald);
    /*----------------------------------------
    				General
    ---------------------------------------- */
    html,
    body {
    	min-width:100px;
    	height:100%;
    }
    body{
    	font: 11px/20px "Trebuchet MS", Arial, Helvetica, sans-serif;
    	position:relative;
    }
    
    #main {
    	font-size:12px;
    	width:1000px;
    	margin:0 auto;
    	min-height:100%;
    	position:relative;
    }
    
    .bg {
    	position:relative;
    	z-index:1;
    }
    
    /* List styling */
    dl dt {
    	background:url(images/list-arrow.gif) no-repeat 0 3px;
    	padding:0 0 3px 32px;
    	margin-bottom:.2em;
    	font-size:18px;
    	line-height:1.2em;
    	color:#191919;
    	}
    dl dd {
    	padding:0 0 0 32px;
    	margin:0 0 1.5em 0;
    	}
    
    /* ----------------------------------------
    					Header
    ---------------------------------------- */
    #header {
    	height:220px;
    	position:relative;
    	z-index:99;
    	margin-bottom:0px;
    }
    body.home #header {height:215px;}
    
    .row-menu {width:100%; height:54px; position:relative;}
    .row-logo {width:100%; overflow:hidden; position:relative;}
    
    /* Logo */
    .logo {
    	position:relative;
    	margin:0;
    	display:inline-block;
    	padding:52px 0 0px 66px;
    	overflow:hidden;
    }
    
    	a#logo {
    		display:block;
    		float:left;
    		margin-right:17px;
    	}
    	.logo h1,
    	.logo h2 {
    		float:left;
    		font-size:32px;
    		line-height:40px;
    		margin-right:16px;
    		margin-bottom:0;
    		font-style:italic;
    		display:inline-block;
    		font-weight:normal;
    		font-family:Georgia, 'Times New Roman', Times, serif;
    	}
    		.logo h1 a,
    		.logo h2 a {
    			display:inline-block;
    			text-decoration:none;
    			padding:4px 0px 7px 55px;
    		}
    
    .logo .tagline {
    	font-size:11px;
    	line-height:17px;
    	font-style:italic;
    	padding:20px 0 0 20px;
    	font-family:Georgia, 'Times New Roman', Times, serif;
    	display:inline-block;
    	float:left;
    	min-height:50px;
    }
    
    /* Login */
    .login {
    	position:absolute;
    	right:87px;
    	top:74px;
    	z-index:3;
    	font-size:10px;
      	line-height:16px;
    	overflow:hidden;
    	font-family:Arial, Helvetica, sans-serif;
    }
    .login a{
       display:inline-block;
       position:relative;
       text-decoration:none;
       margin:0;
       text-transform:uppercase;
       -webkit-transition: all 0.5s ease;
       -moz-transition: all 0.5s ease;
       -o-transition: all 0.5s ease;
       transition: all 0.5s ease;
    }
    .user-login {padding-left:11px; margin-left:7px;}
    
    .login .logout {display:inline-block; width:47px;}
    
    /* Header widget */
    #widget-header {
    	position:absolute;
    	right:0;
    	top:100px;
    	z-index:1;
    }
    	.widget-header {
    
    		}
    
    /* Social Networks */
    #widget-header .social-networks {
    	list-style-type:none;
    	padding:0;
    	margin:0;
    	border:none;
    	}
    	#widget-header .social-networks li {
    		float:left;
    		border:none;
    		padding:0;
    		margin:0 0 0 5px;
    		list-style-type:none;
    		height:30px;
    		}
    		#widget-header .social-networks li a {
    			text-decoration:none;
    			float:left;
    			height:30px;
    			display:block;
    			}
    		#widget-header .social-networks li a:hover {
    			color:red;
    			}
    
    /*----------------------------------------
    				EasyTooltip
    ----------------------------------------*/
    .tooltip {
    	display: none;
    	font-size: 11px;
    	line-height:1.2em;
    	margin: -50px 0 0px;
    	padding: 5px;
    	z-index:99;
    }
    
    /*----------------------------------------
    				Request a quote
     ---------------------------------------- */
    #widget_my_requestquotewidget {
    	width:100%;
    	overflow:hidden;
    }
    
    	.top-box {
    		padding:60px 20px 0 20px;
    		margin-bottom:20px;
    		overflow:hidden;
    		zoom:1;
    		position:relative;
    		min-height:80px;
    		text-align:center;
    		font-size:12px;
    	}
    	.top-box h3 {padding:0;}
    	.top-box .icon-holder {margin-bottom:18px;}
    	.top-box .box-text {margin-bottom:16px;}
    
    /*----------------------------------------
    			Awkward Showcase Slider
  2. Andrew
    Forum Moderator
    Posted 1 year ago #

    Sorry, I don't think that theme is supported here.
    I would try the theme's vendors for support with issues and queries regarding their theme.

  3. makaiman
    Member
    Posted 1 year ago #

    They don't specify for that specific template. I'm a developer, but a little confused as I am new to WordPress, pretty easy, but adjusting for a bigger graphic logo shouldn't be that hard. Someone out there I am sure can help...

  4. alchymyth
    Forum Moderator
    Posted 1 year ago #

    I need the new graphic logo to be;

    640x209

    you seem to have done that already. the image is exactly that size.

    the rest is a pure formatting issue for which a css forum would be the better place to ask; for instance http://csscreator.com/forum

    or try working with a browser inspection tool such as Firebug to find out what styles are responsible for formatting the position of the image and header.

    I'm a developer, but a little confused as I am new to WordPress

    there is nothing WordPress specific to that formatting problem - just css.

  5. makaiman
    Member
    Posted 1 year ago #

    You bet, and thank you. This is a great support forum!

Topic Closed

This topic has been closed to new replies.

About this Topic