1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

Having some image alignment troubles with css

Discussion in 'CSS' started by ramerika, Oct 6, 2009.

  1. #1
    Using drupal theme and having troubles getting my custom logo aligned properly in css. Trying to figure where and how to tell it to align text logo in the center of the header. To see what I get click here. If you need the actual page coding let me know.

    /* $Id: style.css,v 1.1 2009/06/12 07:01:07 agileware Exp $ */
    
    /* begin Page */
    
    body
    {
    	margin: 0 auto;
    	padding: 0;
    	background-color: #ADADAD;
    	background-image: url('images/Page-BgTexture.jpg');
    	background-repeat: repeat;
    	background-attachment: scroll;
    	background-position: top left;
    }
    
    .Main
    {
    	position: relative;
    	width: 100%;
    	left: 0;
    	top: 0;
    }
    
    .PageBackgroundGradient
    {
    	position: absolute;
    	background-image: url('images/Page-BgGradient.jpg');
    	background-repeat: repeat-x;
    	top:0;
    	width:100%;
    	height: 900px;
    	
    }
    
    .cleared
    {
    	float: none;
    	clear: both;
    	margin: 0;
    	padding: 0;
    	border: none;
    	font-size:1px;
    }
    
    form
    {
    	padding:0 !important;
    	margin:0 !important;
    }
    
    table.position
    {
    	position: relative;
    	width: 100%;
    	table-layout: fixed;
    }
    /* end Page */
    
    /* begin Box, Sheet */
    .Sheet
    {
    	position:relative;
    	z-index:0;
    	margin:0 auto;
    	width: 900px;
    	min-width:23px;
    	min-height:23px;
    }
    
    .Sheet-body
    {
    	position: relative;
    	z-index:1;
    	padding: 15px;
    }
    
    .Sheet-tr, .Sheet-tl, .Sheet-br, .Sheet-bl, .Sheet-tc, .Sheet-bc,.Sheet-cr, .Sheet-cl
    {
    	position:absolute;
    	z-index:-1;
    }
    
    .Sheet-tr, .Sheet-tl, .Sheet-br, .Sheet-bl
    {
    	width: 42px;
    	height: 42px;
    	background-image: url('images/Sheet-s.png');
    }
    
    .Sheet-tl
    {
    	top:0;
    	left:0;
    	clip: rect(auto, 21px, 21px, auto);
    }
    
    .Sheet-tr
    {
    	top: 0;
    	right: 0;
    	clip: rect(auto, auto, 21px, 21px);
    }
    
    .Sheet-bl
    {
    	bottom: 0;
    	left: 0;
    	clip: rect(21px, 21px, auto, auto);
    }
    
    .Sheet-br
    {
    	bottom: 0;
    	right: 0;
    	clip: rect(21px, auto, auto, 21px);
    }
    
    .Sheet-tc, .Sheet-bc
    {
    	left: 21px;
    	right: 21px;
    	height: 42px;
    	background-image: url('images/Sheet-h.png');
    }
    
    .Sheet-tc
    {
    	top: 0;
    	clip: rect(auto, auto, 21px, auto);
    }
    
    .Sheet-bc
    {
    	bottom: 0;
    	clip: rect(21px, auto, auto, auto);
    }
    
    .Sheet-cr, .Sheet-cl
    {
    	top: 21px;
    	bottom: 21px;
    	width: 42px;
    	background-image: url('images/Sheet-v.png');
    }
    
    .Sheet-cr
    {
    	right:0;
    	clip: rect(auto, auto, auto, 21px);
    }
    
    .Sheet-cl
    {
    	left:0;
    	clip: rect(auto, 21px, auto, auto);
    }
    
    .Sheet-cc
    {
    	position:absolute;
    	z-index:-1;
    	top: 21px;
    	left: 21px;
    	right: 21px;
    	bottom: 21px;
    	background-color: #FFFFFF;
    }
    
    .Sheet
    {
    	margin-top: -15px !important;
    }
    
    .PageBackgroundSimpleGradient, .PageBackgroundGradient, .PageBackgroundGlare
    {
    	min-width:900px;
    }
    
    /* end Box, Sheet */
    
    /* begin Menu */
    /* menu structure */
    
    .artmenu a, .artmenu a:link, .artmenu a:visited, .artmenu a:hover
    {
    	text-align:left;
    	text-decoration:none;
    	outline:none;
    	letter-spacing:normal;
    	word-spacing:normal;
    }
    
    .artmenu, .artmenu ul
    {
    	margin: 0;
    	padding: 0;
    	border: 0;
    	list-style-type: none;
    	display: block;
    }
    
    .artmenu li
    {
    	margin: 0;
    	padding: 0;
    	border: 0;
    	display: block;
    	float: left;
    	position: relative;
    	z-index: 5;
    	background:none;
    }
    
    .artmenu li:hover
    {
    	z-index: 10000;
    	white-space: normal;
    }
    
    .artmenu li li
    {
    	float: none;
    }
    
    .artmenu ul
    {
    	visibility: hidden;
    	position: absolute;
    	z-index: 10;
    	left: 0;
    	top: 0;
    	background:none;
    }
    
    .artmenu li:hover>ul
    {
    	visibility: visible;
    	top: 100%;
    }
    
    .artmenu li li:hover>ul
    {
    	top: 0;
    	left: 100%;
    }
    
    .artmenu:after, .artmenu ul:after
    {
    	content: ".";
    	height: 0;
    	display: block;
    	visibility: hidden;
    	overflow: hidden;
    	clear: both;
    }
    .artmenu, .artmenu ul
    {
    	min-height: 0;
    }
    
    .artmenu ul
    {
    	background-image: url(images/spacer.gif);
    	padding: 10px 30px 30px 30px;
    	margin: -10px 0 0 -30px;
    }
    
    .artmenu ul ul
    {
    	padding: 30px 30px 30px 10px;
    	margin: -30px 0 0 -10px;
    }
    
    
    
    
    /* menu structure */
    
    .artmenu
    {
    	padding: 6px 6px 6px 6px;
    }
    
    .nav
    {
    	position: relative;
    	height: 42px;
    	z-index: 100;
    }
    
    .nav .l, .nav .r
    {
    	position: absolute;
    	z-index: -1;
    	top: 0;
    	height: 42px;
    	background-image: url('images/nav.png');
    }
    
    .nav .l
    {
    	left: 0;
    	right:0px;
    }
    
    .nav .r
    {
    	right: 0;
    	width: 870px;
    	clip: rect(auto, auto, auto, 870px);
    }
    
    /* end Menu */
    
    /* begin MenuItem */
    .artmenu ul li
    {
    	clear: both;
    }
    
    .artmenu a
    {
    	position:relative;
    	display: block;
    	overflow:hidden;
    	height: 30px;
    	cursor: pointer;
    	text-decoration: none;
    	margin-right: 2px;
    	margin-left: 2px;
    }
    
    .artmenu a .r, .artmenu a .l
    {
    	position:absolute;
    	display: block;
    	height: 90px;
    	background-image: url('images/MenuItem.png');
    }
    
    .artmenu a .l
    {
    	left:0;
    	right:4px;
    }
    
    .artmenu a .r
    {
    	width:408px;
    	right:0;
    	clip: rect(auto, auto, auto, 404px);
    }
    
    .artmenu a .t 
    {
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 13px;
    	color: #02212C;
    	padding: 0 19px;
    	margin: 0 4px;
    	line-height: 30px;
    	text-align: center;
    }
    
    .artmenu a:hover .l, .artmenu a:hover .r
    {
    	top:-30px;
    }
    
    .artmenu li:hover>a .l, .artmenu li:hover>a .r
    {
    	top:-30px;
    }
    
    .artmenu li:hover a .l, .artmenu li:hover a .r
    {
    	top:-30px;
    }
    .artmenu a:hover .t
    {
    	color: #F6DBBB;
    }
    
    .artmenu li:hover a .t
    {
    	color: #363636;
    }
    
    .artmenu li:hover>a .t
    {
    	color: #F6DBBB;
    }
    
    .artmenu a.active .l, .artmenu a.active .r
    {
    	top: -60px;
    }
    
    .artmenu a.active .t
    {
    	color: #022836;
    }
    
    
    /* end MenuItem */
    
    /* begin MenuSeparator */
    .nav .separator
    {
    	display: block;
    	width: 1px;
    	height: 30px;
    	background-image: url('images/MenuSeparator.png');
    }
    
    /* end MenuSeparator */
    
    /* begin MenuSubItem */
    .artmenu ul a
    {
    	display:block;
    	text-align: center;
    	white-space: nowrap;
    	height: 20px;
    	width: 180px;
    	overflow:hidden;
    	line-height: 20px;
    	margin-right: auto;
    	background-image: url('images/subitem-bg.png');
    	background-position: left top;
    	background-repeat: repeat-x;
    	border-width: 0px;
    	border-style: solid;
    }
    
    .nav ul.artmenu ul span, .nav ul.artmenu ul span span
    {
    	display: inline;
    	float: none;
    	margin: inherit;
    	padding: inherit;
    	background-image: none;
    	text-align: inherit;
    	text-decoration: inherit;
    }
    
    .artmenu ul a, .artmenu ul a:link, .artmenu ul a:visited, .artmenu ul a:hover, .artmenu ul a:active, .nav ul.artmenu ul span, .nav ul.artmenu ul span span
    {
    	text-align: left;
    	text-indent: 12px;
    	text-decoration: none;
    	line-height: 20px;
    	color: #363636;
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 13px;
    }
    
    .artmenu ul ul a
    {
    	margin-left: auto;
    }
    
    .artmenu ul li a:hover
    {
    	color: #E6F8FE;
    	background-position: 0 -20px;
    }
    
    .artmenu ul li:hover>a
    {
    	color: #E6F8FE;
    	background-position: 0 -20px;
    }
    
    .nav .artmenu ul li a:hover span, .nav .artmenu ul li a:hover span span
    {
    	color: #E6F8FE;
    }
    
    .nav .artmenu ul li:hover>a span, .nav .artmenu ul li:hover>a span span
    {
    	color: #E6F8FE;
    }
    
    
    /* end MenuSubItem */
    
    /* begin Header */
    div.Header
    {
    	margin: 0 auto;
    	position: relative;
    	z-index:0;
    	width: 870px;
    	height: 100px;
    }
    /* end Header */
    
    /* begin Logo */
    .logo
    {
    	display : block;
    	position: absolute;
    	left: 10px;
    	top: 10px;
    }
    /* end Logo */
    
    /* begin ContentLayout */
    .contentLayout
    {
    	position: relative;
    	margin-bottom: 0px;
    	width: 870px;
    }
    /* end ContentLayout */
    
    /* begin Box, Block */
    .Block
    {
    	position:relative;
    	z-index:0;
    	margin:0 auto;
    	min-width:15px;
    	min-height:15px;
    }
    
    .Block-body
    {
    	position: relative;
    	z-index:1;
    	padding: 2px;
    }
    
    .Block-tr, .Block-tl, .Block-br, .Block-bl, .Block-tc, .Block-bc,.Block-cr, .Block-cl
    {
    	position:absolute;
    	z-index:-1;
    }
    
    .Block-tr, .Block-tl, .Block-br, .Block-bl
    {
    	width: 14px;
    	height: 14px;
    	background-image: url('images/Block-s.png');
    }
    
    .Block-tl
    {
    	top:0;
    	left:0;
    	clip: rect(auto, 7px, 7px, auto);
    }
    
    .Block-tr
    {
    	top: 0;
    	right: 0;
    	clip: rect(auto, auto, 7px, 7px);
    }
    
    .Block-bl
    {
    	bottom: 0;
    	left: 0;
    	clip: rect(7px, 7px, auto, auto);
    }
    
    .Block-br
    {
    	bottom: 0;
    	right: 0;
    	clip: rect(7px, auto, auto, 7px);
    }
    
    .Block-tc, .Block-bc
    {
    	left: 7px;
    	right: 7px;
    	height: 14px;
    	background-image: url('images/Block-h.png');
    }
    
    .Block-tc
    {
    	top: 0;
    	clip: rect(auto, auto, 7px, auto);
    }
    
    .Block-bc
    {
    	bottom: 0;
    	clip: rect(7px, auto, auto, auto);
    }
    
    .Block-cr, .Block-cl
    {
    	top: 7px;
    	bottom: 7px;
    	width: 14px;
    	background-image: url('images/Block-v.png');
    }
    
    .Block-cr
    {
    	right:0;
    	clip: rect(auto, auto, auto, 7px);
    }
    
    .Block-cl
    {
    	left:0;
    	clip: rect(auto, 7px, auto, auto);
    }
    
    .Block-cc
    {
    	position:absolute;
    	z-index:-1;
    	top: 7px;
    	left: 7px;
    	right: 7px;
    	bottom: 7px;
    	background-color: #EBEBEB;
    }
    
    .Block
    {
    	margin: 7px;
    }
    
    /* end Box, Block */
    
    /* begin BlockHeader */
    .BlockHeader
    {
    	position:relative;
    	z-index:0;
    	height: 30px;
    	padding: 0 7px;
    	margin-bottom: 7px;
    }
    
    .BlockHeader .t
    {
    	height: 30px;
    	color: #000000;
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 13px;
    	white-space : nowrap;
    	padding: 0 7px;
    	line-height: 30px;
    }
    
    .BlockHeader .l, .BlockHeader .r
    {
    	display:block;
    	position:absolute;
    	z-index:-1;
    	height: 30px;
    	background-image: url('images/BlockHeader.png');
    }
    
    .BlockHeader .l
    {
    	left:0;
    	right:6px;
    }
    
    .BlockHeader .r
    { 
    	width:890px;
    	right:0;
    	clip: rect(auto, auto, auto, 884px);
    }
    
    .header-tag-icon
    {
    	display:inline-block;
    	background-position:left top;
    	background-image: url('images/BlockHeaderIcon.png');
    	padding:0 0 0 22px;
    	background-repeat: no-repeat;
    	min-height: 15px;
    	margin: 0 0 0 5px;
    }
    
    
    /* end BlockHeader */
    
    /* begin Box, BlockContent */
    .BlockContent
    {
    	position:relative;
    	z-index:0;
    	margin:0 auto;
    	min-width:1px;
    	min-height:1px;
    }
    
    .BlockContent-body
    {
    	position: relative;
    	z-index:1;
    	padding: 8px;
    }
    
    .BlockContent-body
    {
    	color:#363636;
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 13px;
    }
    
    .BlockContent-body a:hover, .BlockContent-body a.hover
    {
    	color: #079ACF;
    	font-family: Arial, Helvetica, Sans-Serif;
    	text-decoration: none;
    }
    
    .BlockContent-body ul
    {
    	list-style-type: none;
    	color: #4A4A4A;
    	margin:0;
    	padding:0;
    }
    
    .BlockContent-body li
    {
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 13px;
    }
    
    .BlockContent-body ul li
    {
    	padding:0px 0 0px 14px;
    	background-image: url('images/BlockContentBullets.png');
    	background-repeat:no-repeat;
    	margin:0.5em 0 0.5em 0;
    	line-height:1.2em;
    }
    
    /* end Box, BlockContent */
    
    /* begin Box, Post */
    .Post
    {
    	position:relative;
    	z-index:0;
    	margin:0 auto;
    	min-width:1px;
    	min-height:1px;
    }
    
    .Post-body
    {
    	position: relative;
    	z-index:1;
    	padding: 10px;
    }
    
    .Post
    {
    	margin: 10px;
    }
    
    /* Start images */
    a img
    {
    	border: 0;
    }
    
    .article img, img.article
    {
    	margin: 1em;
    }
    
    .metadata-icons img
    {
    	border: none;
    	vertical-align: middle;
    	margin:2px;
    }
    /* Finish images */
    
    /* Start tables */
    
    .article table, table.article
    {
    	border-collapse: collapse;
    	margin: 1px;
    	width:auto;
    }
    
    .article table, table.article .article tr, .article th, .article td
    {
    	background-color:Transparent;
    }
    
    .article th, .article td
    {
    	padding: 2px;
    	border: solid 1px #B5B5B5;
    	vertical-align: top;
    	text-align:left;
    }
    
    .article th
    {
    	text-align:center;
    	vertical-align:middle;
    	padding: 7px;
    }
    
    .article caption {
    	margin: 0 1em 1em 1em;
    }
    
    .article table {
    	margin: 1em;
    }
    
    /* Finish tables */
    /* end Box, Post */
    
    /* begin PostHeaderIcon */
    .PostHeaderIcon-wrapper
    {
    	text-decoration:none;
    	margin: 0.2em 0;
    	padding: 0;
    	font-weight:normal;
    	font-style:normal;
    	letter-spacing:normal;
    	word-spacing:normal;
    	font-variant:normal;
    	text-decoration:none;
    	font-variant:normal;
    	text-transform:none;
    	text-align:left;
    	text-indent:0;
    	line-height:inherit;
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 24px;
    	color: #045B7B;
    }
    
    .PostHeaderIcon-wrapper, .PostHeaderIcon-wrapper a, .PostHeaderIcon-wrapper a:link, .PostHeaderIcon-wrapper a:visited, .PostHeaderIcon-wrapper a:hover
    {
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 24px;
    	color: #045B7B;
    }
    
    /* end PostHeaderIcon */
    
    /* begin PostHeader */
    .PostHeader a:hover, .PostHeader a.hovered
    {
      font-family: Arial, Helvetica, Sans-Serif;
      text-decoration: none;
      text-align: left;
      color: #08A8E2;
    }
    /* end PostHeader */
    
    /* begin PostIcons */
    .PostHeaderIcons
    {
    	padding:1px;
    }
    
    .PostHeaderIcons, .PostHeaderIcons a, .PostHeaderIcons a:link, .PostHeaderIcons a:visited, .PostHeaderIcons a:hover
    {
    	font-family: Arial, Helvetica, Sans-Serif;
    	color: #545454;
    }
    
    .PostHeaderIcons a, .PostHeaderIcons a:link, .PostHeaderIcons a:visited, .PostHeaderIcons a:hover
    {
    	margin:0;
    }
    
    .PostHeaderIcons a:hover, .PostHeaderIcons a.hover
    {
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-style: italic;
    	font-weight: normal;
    	text-decoration: underline;
    	color: #08A8E2;
    }
    /* end PostIcons */
    
    /* begin PostContent */
    /* Content Text Font & Color (Default) */
    body
    {
      font-family: Arial, Helvetica, Sans-Serif;
      font-size: 13px;
      color: #292929;
    }
    
    .PostContent
    {
      font-family: Arial, Helvetica, Sans-Serif;
      color: #292929;
    }
    
    
    /* Start Content link style */
    a
    {
      font-family: Arial, Helvetica, Sans-Serif;
      text-decoration: none;
      color: #0680AC;
    }
    
    /* :hover - adds special style to an element when you mouse over it. */
    a:hover, a.hover
    {
      font-family: Arial, Helvetica, Sans-Serif;
      text-decoration: none;
      color: #08A8E2;
    }
    
    /* Finish Content link style */
    
    /* Resert some headings default style & links default style for links in headings*/
    h1, h2, h3, h4, h5, h6,
    h1 a, h2 a, h3 a, h4 a, h5 a, h6 a
    h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover
    h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited
    {
      font-weight: normal;
      font-style: normal;
      text-decoration: none;
    }
    
    
    /* Start Content headings Fonts & Colors  */
    h1, h1 a, h1 a:link, h1 a:visited, h1 a:hover
    {
      font-family: Arial, Helvetica, Sans-Serif;
      font-size: 32px;
      color: #0680AC;
    }
    
    h2, h2 a, h2 a:link, h2 a:visited, h2 a:hover
    {
      font-family: Arial, Helvetica, Sans-Serif;
      font-size: 24px;
      color: #08A8E2;
    }
    
    h3, h3 a, h3 a:link, h3 a:visited, h3 a:hover
    {
      font-family: Arial, Helvetica, Sans-Serif;
      font-size: 19px;
      color: #595959;
    }
    
    h4, h4 a, h4 a:link, h4 a:visited, h4 a:hover
    {
      font-family: Arial, Helvetica, Sans-Serif;
      font-size: 16px;
      color: #0796CA;
    }
    
    h5, h5 a, h5 a:link, h5 a:visited, h5 a:hover
    {
      font-family: Arial, Helvetica, Sans-Serif;
      font-size: 13px;
      color: #033B4F;
    }
    
    h6, h6 a, h6 a:link, h6 a:visited, h6 a:hover
    {
      font-family: Arial, Helvetica, Sans-Serif;
      font-size: 11px;
      color: #033B4F;
    }
    /* Finish Content headings Fonts & Colors  */
    /* end PostContent */
    
    /* begin PostBullets */
    /* Start Content list */
    ol, ul
    {
    	color: #404040;
    	margin:1em 0 1em 2em;
    	padding:0;
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 13px;
    }
    
    li ol, li ul
    {
    	margin:0.5em 0 0.5em 2em;
    	padding:0;
    }
    
    li 
    {
    	margin:0.2em 0;
    	padding:0;
    }
    
    ul
    {
    	list-style-type: none;
    }
    
    ol
    {
    	list-style-position:inside;
    }
    
    .Post li
    {
    	padding:0px 0 0px 14px;
    	line-height:1.2em;
    }
    
    .Post ol li, .Post ul ol li
    {
    	background: none;
    	padding-left:0;
    }
    
    .Post ul li, .Post ol ul li 
    {
    	background-image: url('images/PostBullets.png');
    	background-repeat:no-repeat;
    	padding-left:14px;
    }
    
    
    /* Finish Content list */
    /* end PostBullets */
    
    /* begin PostQuote */
    /* Start blockquote */
    blockquote p
    {
    	color:#1B1004;
    	font-family: Arial, Helvetica, Sans-Serif;
    }
    
    blockquote
    {
    	border:solid 1px #70D5FA; 
    	margin:10px 10px 10px 50px;
    	padding:5px 5px 5px 41px;
    	background-color:#B5E9FC;
    	background-image:url('images/PostQuote.png');
    	background-position:left top;
    	background-repeat:no-repeat;
    }
    
    
    /* Finish blockuote */
    /* end PostQuote */
    
    /* begin PostMetadata */
    .PostMetadataFooter
    {
    	padding:1px;
    	background-color: #E0E0E0;
    	border-color: #C7C7C7;
    	border-style: solid;
    	border-width: 1px;
    }
    /* end PostMetadata */
    
    /* begin PostIcons */
    .PostFooterIcons
    {
    	padding:1px;
    }
    
    .PostFooterIcons, .PostFooterIcons a, .PostFooterIcons a:link, .PostFooterIcons a:visited, .PostFooterIcons a:hover
    {
    	font-family: Arial, Helvetica, Sans-Serif;
    	color: #454545;
    }
    
    .PostFooterIcons a, .PostFooterIcons a:link, .PostFooterIcons a:visited, .PostFooterIcons a:hover
    {
    	margin:0;
    }
    
    .PostFooterIcons a:hover, .PostFooterIcons a.hover
    {
    	font-family: Arial, Helvetica, Sans-Serif;
    	text-decoration: none;
    	color: #0792C5;
    }
    /* end PostIcons */
    
    /* begin Button */
    a.Button,
    button.Button
    {
    	display:inline-block;
    	width: auto;
    	outline:none;
    	border:none;
    	background:none;
    	line-height:33px;
    	margin:0;
    	padding:0;
    	overflow: visible;
    	cursor: default;
    	text-decoration: none !important;
    	z-index:0;
    }
    
    a.Button .btn,
    button.Button .btn
    {
    	display:block;
    	position:relative;
    	float:left;
    	height: 33px;
    	overflow:hidden;
    	white-space: nowrap;
    	width: auto;
    	color: #1C1C1C;
    }
    
    a.Button .btn .t,
    button.Button .btn .t
    {
    	display:block;
    	height: 33px;
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 13px;
    	white-space: nowrap;
    	text-align: left;
    	padding: 0 16px;
    	line-height: 33px;
    	text-decoration: none !important;
    }
    
    input, select
    {
    	font-family: Arial, Helvetica, Sans-Serif;
    	font-size: 13px;
    }
    
    a.Button .hover,
    a.Button:hover,
    button.Button .hover,
    button.Button:hover
    {
    	color: #F6DBBB;
    	text-decoration: none !important;
    }
    
    a.Button .active,
    button.Button .active
    {
    	color: #E6F8FE;
    }
    
    a.Button .btn .l,
    a.Button .btn .r,
    button.Button .btn .l,
    button.Button .btn .r
    {
    	display:block;
    	position:absolute;
    	z-index:-1;
    	height: 99px;
    	background-image: url('images/Button.png');
    }
    
    a.Button .btn .l,
    button.Button .btn .l
    {
    	left:0;
    	right:10px;
    }
    
    a.Button .btn .r,
    button.Button .btn .r
    {
    	width:409px;
    	right:0;
    	clip: rect(auto, auto, auto, 399px);
    }
    
    a.Button .btn.hover .l,
    a.Button .btn.hover .r,
    a.Button .btn:hover .l,
    a.Button .btn:hover .r,
    button.Button .btn.hover .l,
    button.Button .btn.hover .r,
    button.Button .btn:hover .l,
    button.Button .btn:hover .r
    {
    	top: -33px;
    }
    
    a.Button .btn.active .l,
    a.Button .btn.active .r,
    button.Button .btn.active .l,
    button.Button .btn.active .r
    {
    	top: -66px;
    }
    
    /* end Button */
    
    /* begin Footer */
    .Footer
    {
    	position:relative;
    	z-index:0;
    	overflow:hidden;
    	width: 870px;
    	margin: 5px auto 0px auto;
    }
    
    .Footer .Footer-inner
    {
    	height:1%;
    	position: relative;
    	z-index: 0;
    	padding: 8px;
    	text-align: center;
    }
    
    .Footer .Footer-background
    {
    	position:absolute;
    	z-index:-1;
    	background-repeat:no-repeat;
    	background-image: url('images/Footer.png');
    	width: 870px;
    	height: 150px;
    	bottom:0;
    	left:0;
    }
    
    .rss-tag-icon
    {
    	position: relative;
    	display:block;
    	float:left;
    	background-image: url('images/rssIcon.png');
    	background-position: center right;
    	background-repeat: no-repeat;
    	margin: 0 5px 0 0;
    	height: 9px;
    	width: 15px;
    }
    
    .Footer .Footer-text p
    {
    	margin: 0;
    }
    
    .Footer .Footer-text
    {
    	display:inline-block;
    	color:#034259;
    	font-family: Arial, Helvetica, Sans-Serif;
    }
    
    .Footer .Footer-text a:hover
    {
    	text-decoration: none;
    	color: #078FC0;
    	font-family: Arial, Helvetica, Sans-Serif;
    	text-decoration: none;
    }
    /* end Footer */
    
    /* begin PageFooter */
    .page-footer, .page-footer a, .page-footer a:link, .page-footer a:visited, .page-footer a:hover
    {
    	font-family:Arial;
    	font-size:10px;
    	letter-spacing:normal;
    	word-spacing:normal;
    	font-style:normal;
    	font-weight:normal;
    	text-decoration:underline;
    	color:#26BFF7;
    }
    
    .page-footer
    {
    	margin:1em;
    	text-align:center;
    	text-decoration:none;
    	color: #292929;
    }
    /* end PageFooter */
    
    /* begin LayoutCell */
    .contentLayout .content
    {
    	position: relative;
    	margin: 0;
    	padding: 0;
    	border: 0;
    	float: left;
    	overflow: hidden;
    	width: 652px;
    }
    .contentLayout .content-wide
    {
    	position: relative;
    	margin: 0;
    	padding: 0;
    	border: 0;
    	float: left;
    	overflow: hidden;
    	width: 869px;
    }
    /* end LayoutCell */
    
    /* begin LayoutCell */
    .contentLayout .sidebar1
    {
    	position: relative;
    	margin: 0;
    	padding: 0;
    	border: 0;
    	float: left;
    	overflow: hidden;
    	width: 217px;
    }
    /* end LayoutCell */
    
    
    
    /*
    ** HTML elements
    */
    #footer
    {
    	text-align: center;
    }
    
    ul li 
    {
    	text-align: left;
    	background-image: none;
    	display: block;
    }
    
    li.expanded, li.leaf, li.collapsed
    {
    	list-style-type: none;
    	list-style-image: none;
    	background-image: none;
    }
    
    .tabs, .links, .service-links img, service-links img
    {
    	padding-left: 0px;
    	margin: 0px;
    }
    
    .tabs li, .links li
    {
    	float: left;
    	display: block;
    	padding: 0 0 0 1em;
    }
    
    ul.primary {
    	border-bottom: none;
    }
    
    #user-login-form 
    {
    	text-align: left;
    }
    
    #user-login-form ul li
    {
    	background-image: none;
    	padding-left:0;
    }
    
    fieldset
    {
    	margin: 1em 0;
    	padding: 1em;
    	border: 1px solid ;
    	width: 95%;
    }
    
    fieldset legend 
    {
    	/* Fix disappearing legend in FFox */
    	display: block;
    }
    
    .breadcrumb 
    {
    	display: block; 
    	padding-bottom: .7em;
    }
    
    .form-text, .form-textarea
    {
    	width: 95%;
    	text-align: left;
    }
    
    .tags
    {
    	float: left;
    }
    
    .messages
    {
    	padding: 5px;
    	margin: 5px 0;
    }
    
    .status
    {
    	border: 1px solid #090;
    	background:#C9FBC8;
    	margin: 5px 0;
    }
    
    .messages li
    {
    	margin: 5px 0;
    }
    
    tr.even, tr.odd
    {
    	background-color: transparent;
    }
    
    #forum .links li
    {
    	float: none;
    	clear: both;
    }
    
    #forum table
    {
    	width: auto;
    	margin-top: 15px;
    }
    
    #forum td.container
    {
    	padding-top: 15px;
    	border-left: none;
    	border-right: none;
    }
    
    #forum td.active
    {
    	background-color: transparent;
    }
    
    #forum td.forum, #forum td.topics, #forum td.posts, #forum td.last-reply
    {
    	padding-top: 4px;
    	padding-bottom: 4px;
    }
    
    #forum td.container
    {
    	font-weight: bold;
    }
    
    #forum td.active
    {
    	background-color: transparent;
    }
    
    .forum-topic-navigation
    {
    	border-top: 0px transparent;
    	border-bottom: 0px transparent;
    }
    
    .forum-topic-navigation .topic-previous
    {
    	text-align: left;
    	float: left;
    }
    
    .forum-topic-navigation .topic-next
    {
    	text-align: right;
    	float: right;
    }
    
    .read_more
    {
    	margin: 5px 0px;
    	text-align:left;
    }
    
    .sticky-table H2
    {
    	font-size: 10px;
    }
    
    .Footer .Footer-inner
    {
    	float: left;
    	width: 100%;
    }
    
    .comment span.new-text {
      color: #FF0000;
      font-size: 60%;
      font-weight: normal;
    }
    
    .preview .node,
    .preview .comment,
    .sticky {
      margin: 0;
      padding: 0.5em 0;
      border: 0;
      background: 0;
    }
    
    .sticky {
      padding: 1em;
      background-color: #EBEBEB;
      border: 1px solid #DEDEDE;
      margin-bottom: 2em;
    }
    Code (markup):
     
    ramerika, Oct 6, 2009 IP
  2. MhW

    MhW Active Member

    Messages:
    370
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    85
    #2
    Find:
    <img width="198" vspace="1" hspace="5" height="29" border="0" alt="MarketingMaster.com" src="http://www.MarketingMaster.com/images/sm-logo.gif"/>
    Code (markup):
    Replace with:
    <img width="198" vspace="1" hspace="5" height="29" border="0" alt="MarketingMaster.com" src="http://www.MarketingMaster.com/images/sm-logo.gif" style="float: left; margin-bottom: 5px;" />
    Code (markup):

    Find:
    <font size="1" face="arial,geneva" color="#ffffff"> The Secrets of Power Marketing for Extraordinary Success!</font>
    Code (markup):
    Replace with:
    <font size="1" face="arial,geneva" color="#ffffff" style="line-height: 35px;"> The Secrets of Power Marketing for Extraordinary Success!</font>
    Code (markup):
    --

    It's not pretty, but then again your site is using a lot of outdated markup and not a whole lot of CSS. Still, the above should work fine :)
     
    MhW, Oct 6, 2009 IP
  3. ramerika

    ramerika Well-Known Member

    Messages:
    947
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    130
    #3
    Wrong site my site is not the dot com its the dot info

    But here's the code where the current logo is used to display and I need to know how to change it so text logo displays in the center:

     
      <div class="logo">
                  <?php if ($logo): ?>
                    <a href="<?php print $base_path ?>" title="<?php print t('Home') ?>"><img src="<?php print $logo ?>" alt="<?php print t('Home') ?>" /></a>
                  <?php endif; ?>
                </div>
    
    Code (markup):
    And here's the css stylesheet header and logo code:

     
    /* begin Header */
    div.Header
    {
    	margin: 0 auto;
    	position: relative;
    	z-index:0;
    	width: 870px;
    	height: 100px;
    }
    /* end Header */
    
    /* begin Logo */
    .logo
    {
    	display : block;
    	position: absolute;
    	left: 10px;
    	top: 10px;
    }
    /* end Logo */
    
    Code (markup):
     
    Last edited: Oct 7, 2009
    ramerika, Oct 6, 2009 IP
  4. MhW

    MhW Active Member

    Messages:
    370
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    85
    #4
    Oh my bad, your site wouldn't load for me last night so I went to it through Google Cache, and must have ended up on the .com

    In that case, find:
    <div class="logo">
                  <?php if ($logo): ?>
                    <a href="<?php print $base_path ?>" title="<?php print t('Home') ?>"><img src="<?php print $logo ?>" alt="<?php print t('Home') ?>" /></a>
                  <?php endif; ?>
                </div>
    Code (markup):
    Replace with:
    
    <div class="logo">
                  <?php if ($logo): ?>
                    <a href="<?php print $base_path ?>" title="<?php print t('Home') ?>"><img src="<?php print $logo ?>" alt="<?php print t('Home') ?>" style="margin-left: 110px;"  /></a>
                  <?php endif; ?>
                </div>
    Code (markup):
     
    MhW, Oct 7, 2009 IP
  5. ramerika

    ramerika Well-Known Member

    Messages:
    947
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    130
    #5
    YESSSSSSSSS! MhW I could give you the biggest hug man I've been trying to fix that for days lol.

    I need to do another thing...how do I extend the black background in the header to go the enter width of the header?
     
    Last edited: Oct 7, 2009
    ramerika, Oct 7, 2009 IP
  6. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #6
    The logo is still to the left in my browser. Did you implement the changes yet?

    Your black background is actually the whole width of the header, but the header isn't the full width of the white part, which is called Sheet.

    
    /* begin Header */
    div.Header
    {
    	margin: 0 auto;
    	position: relative;
    	z-index:0;
    	[b]width: 870px;[/b] what happens if you widen this? 
    	height: 100px;
    }
    /* end Header */
    
    Code (markup):
    You might not be able to because sheet-body, who is a child of Sheet, has 15px worth of padding on each side. You could remove the padding, but then you'd prolly want to add it back in to another element who includes the rest of the page but not the header... maybe contentLayout?
    For centering the logo I would have removed the absolute positioning and let it center with automargins, though the width of the logo would have to be known.

    Man, so this is Drupal code? Font tags? thousands of wrapping divs? 15 different stylesheets? arg! templates!!
     
    Last edited: Oct 7, 2009
    Stomme poes, Oct 7, 2009 IP
  7. MhW

    MhW Active Member

    Messages:
    370
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    85
    #7
    The header design seems to have changed since last night. Previously the header consisted of a single logo image a little offset to the left. Woke up this morning to find it had all been changed around. *Shrug*
     
    MhW, Oct 7, 2009 IP
  8. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #8
    Is it even the same site anymore??
     
    Stomme poes, Oct 7, 2009 IP
  9. MhW

    MhW Active Member

    Messages:
    370
    Likes Received:
    23
    Best Answers:
    0
    Trophy Points:
    85
    #9
    Yeah, the content is pretty much the same - only thing that seems to have changed is the header / logo. Previously it was all white with a single image as the logo, tied up in several nested divs, some had position: absolute; others had position: relative; and each had their own top: / left: values. Sorry to say it was a real mess.

    Now there seems to be a new header, with a new logo. Half of the header div seems to be covered up by God knows what. I'm starting to wonder why ramerika wants the black header to cover the whole width of the sheet-body div - it would surely look awful. :confused:
     
    MhW, Oct 7, 2009 IP
  10. ramerika

    ramerika Well-Known Member

    Messages:
    947
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    130
    #10
    I only want the black to cover just the header and idk what happened to the alignment of the logo but it changed and I only made the changes MhW recommended...ARGH!!! Damn Drupal templates I tell you. Other than the issues I'm having with the templates Drupal is awesome. The css in the template is a hot damn mess which is why I need the help. But let me see what exactly caused the changes.
     
    ramerika, Oct 7, 2009 IP
  11. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #11
    Whoever wrote this Drupal template doesn't know their butt from their face and needs to stop coding immediately, or learn how to! </rant>

    Anyway,
    It is. Do you have Firefox or Opera? In Firefox, get the plugin called Aardvark (or Firebug if you'd rather have all that). https://addons.mozilla.org

    Opera already has Dragonfly, you just have to find it in the tools somewhere.

    Anyway if you have a tool that can highlight elements on a page, you'll see the header is everywhere the black is, and there is no header element who extends past the black.

    And, because this template-writer did the usualy template garbage by having 500 thousand different CSS files, all referring to the same elements on the page in different, conflicting ways a thousand times over, it's very likely the changes from MhW are simply being overridden... I mean, you can put left margins on abso-po'd elements and it will move them normally. But who knows what all css this thing is getting.

    Why I freaking hate bloated template garbage. And this looks like a really, really simple page. Is there maybe another Drupal theme that looks similar (I mean, there are like bazillions of templates) that you could use instead??

    Anyone using <font> tags is to be avoided.
     
    Stomme poes, Oct 8, 2009 IP
    MhW likes this.
  12. ramerika

    ramerika Well-Known Member

    Messages:
    947
    Likes Received:
    11
    Best Answers:
    0
    Trophy Points:
    130
    #12
    lol stomme poes I spent a few days going thru the templates drupal had on their site but all were pretty much garbage so I decided to use the one I am now. But I figured out what was causing the issue and fixed it. Thanks again to you and MhW for the assistance.
     
    ramerika, Oct 8, 2009 IP