PDA

View Full Version : Cms adds padding??



themarker0
Mar 22nd, 2010, 07:51 PM
So i am porting a website to a CMS. A little issue on the last part though.

Looky.

http://tm0.org/yes/phpsqlitecms/index
http://yesshelter.ca/

Can you see the padding added before the paragraph? I have looked through all the template files and the CSS, i will post them here.

Any idea why this is happening? It had a top padding around the content1, now its top is right, but left is wrong :/ I've gone through it top to bottom.

CSS

/* uwpeterborough style sheet */

body {
background-color:#C0C9C4;
font-family:Helvetica, sans-serif;
font-size:14px;
color:#2C4438;
margin-top:0px;
margin-bottom:0px;
margin-left:auto;
margin-right:auto;
}

.gmap {
position:relative;
width:400px;
height:300px;
border:1px solid black;
/*
background-image:url(http://yesshelter.ca/images/gmap.jpg);
background-position:top left;
background-repeat:no-repeat;
*/
}

/* inpage photos */
.inpageright {
border:0px solid #510000;
padding:0px;
margin-left:5px;
margin-bottom:5px;
}

.inpagenone {
border:0px solid #510000;
padding:0px;
margin-bottom:5px;
}

.inpageleft {
border:0px solid #510000;
padding:0px;
margin-right:5px;
margin-bottom:5px;
}

/* masthead style */
.masthead {
background-color:white;
}

/* main navigation style */
.navigation {
background-color:white;
}

/* background repeating border gradients */
.bgleft {
color:transparent;
background-image:url(http://yesshelter.ca/images/bgleft.jpg);
background-position:top right;
background-repeat:repeat-y;
}
.bgright {
color:transparent;
background-image:url(http://yesshelter.ca/images/bgright.jpg);
background-position:top left;
background-repeat:repeat-y;
}

/* contains the body and footer, with a border and padding */
.superdiv {
background-color:#FFFFFF;
width:845px;
padding-top:30px;
margin-bottom:0px;
margin:auto;
}

/* the main table in the superdiv */
.maintable {
background-color:white;
width:760px;
margin:auto;
margin-top:3px;
}

/* left column for hompage */
.col1 {
padding-top:5px;
padding-bottom:15px;
}
/* right column for all pages */
.col2 {
width:250px;
padding-top:0px;
padding-bottom:15px;
text-align:center;
}

/* various text boxes that are divs */
.content1 {
padding-left:0px;
padding-right:80px;
padding-top:0px;
padding-bottom:0px;
text-align:left;
background-color:#FFFFFF;
}
.content2 {
width:233px;
text-align:center;
}
.content2b {
background-color:#FFF2D0;
padding-bottom:20px;
padding-left:15px;
padding-right:1px;
color:#820024;
font-size:13px;
}

/* box height for the homepage */
.homehit {
min-height:475px !important;
line-height:18px;
}

/* footer area links */
div.footer {
width:100%;
font-family:Helvetica, sans-serif;
color:#2C4438;
border:0px solid red;
background-color:white;
margin-bottom:0px;
text-align:center;
font-size:10px;
font-weight:normal;
padding-top:5px;
padding-bottom:5px;
}
div.footer a:link {
color:#820024;
text-decoration:none;
}
div.footer a:visited {
color:#820024;
text-decoration:none;
}
div.footer a:hover, .footer a:active {
color:#820024;
text-decoration:underline;
}

/* all default links */
a:link {
color:#005481;
text-decoration:underline;
}
a:visited {
color:#005481;
text-decoration:underline;
}
a:hover, a:active {
color:#820024;
text-decoration:underline;
}

/* headers */
h1 {
font-family:"Times New Roman", Times, serif;
font-size:34px;
color:#2C4438;
font-weight:bold;
margin-top:0px;
padding-top:0px;
}

h2 {
font-family:"Times New Roman", Times, serif;
font-size:22px;
color:#2C4438;
font-weight:bold;
}

h3 {
font-family:"Times New Roman", Times, serif;
font-size:18px;
color:#2C4438;
font-weight:bold;
}

h4 {
font-family:"Times New Roman", Times, serif;
font-size:16px;
color:#2C4438;
font-weight:bold;
}

.nopad {
margin:0px;
padding:0px;
}

p {
margin-top:14px;
margin-bottom:14px;
}

ul {
margin-left:15px;
padding-left:15px;
}
ul li {
padding-bottom:4px;
}
ul li ul {
padding-top:4px;
}

form {
margin:0px;
padding:0px;
}

.ascii {
line-height: 8px !important;
font-size:8px;
}

.pdf {
font-size:12px;
}



#admin { margin:0px; padding:7px 10px 7px 10px; background:#ffffe1; border-bottom:1px solid #c0c0c0; }
#admin p.left { font-size:0.9em; margin: 0px; padding: 0px; float:left; }
#admin p.right { font-size:0.9em; margin: 0px; padding: 0px; text-align:right; }
#admin a { text-decoration:none; }
#admin a:hover span { text-decoration:underline; }
#admin a img { margin:0px 5px -3px 0px; padding:0px; }

#top,
#nav,
#subnav,
#main,
#bottom { max-width:58em; margin-left:auto; margin-right:auto; padding:0; }

#top { position:relative; height:4em; padding:0; }
#top .logo { margin:0; padding:0.7em 0 0 0; float: left; color:#000080; }
#top .subtitle { margin:0; padding:0.9em 0 0 0; text-align: right; font-size: 1.1em; font-weight: normal; }
#top h1 { margin:0; padding:0; font-size:2em; color:#000080; }
#top h1 a { color:#000080; text-decoration: none; }
#top h1 a:hover { color:#0000aa; }

#nav { padding:0px 30px 0px 30px; }
#navlist { margin:0 0 0 -0.45em; padding:0; list-style-type:none; font-size:0.9em; }
#navlist li { display:inline; padding:0; }
#navlist a { padding:0.3em 0.5em 0.3em 0.5em; display:inline-block; }
#navlist a:link,
#navlist a:visited { }
#navlist a:link#current,
#navlist a:visited#current { font-weight:bold; }
#navlist a:hover,
#navlist a:hover#current { background:#efefef; text-decoration:none; }

#mainwrapper { margin:0; padding:0px 32px 50px 32px; background:#fff; }
#sidebarwrapper { width:100%; float:left; margin-right:-16em; }

#content { margin:0; padding:0px 0px 0px 0px; max-width:43em; }
#sidebarwrapper #content { margin:0 16px 50px 0; }

#content #breadcrumbs { position:relative; top:-1.3em; margin:0; padding:0 0 0.5em 0; font-size:0.75em; }
#content #pageinfo { position:relative; top:-0.5em; margin:0; padding:0 0 1em 0; font-size:0.9em; }
#content #time { position:relative; top:-0.5em; margin:0; padding:0 0 1em 0; font-size:0.9em; }
#content p,
#content ul,
#content ol,
#content dl { font-size:0.9em; line-height:1.5em; margin-top:0; }
#content ul ul,
#content ol ol,
#content ol ul,
#content dl dl { font-size:1em; }
#content dt { font-weight:bold; }
#content dd { padding:0.25em 0 0.5em 0; }
#content h2.teaser { margin: 0px 0px 0px 0px; font-size:0.9em; line-height:1.5em; font-weight:bold; color:#000; text-decoration:none; }
#content h2.teaser a { margin: 0px 0px 0px 0px; font-size:1em; font-weight:bold; color:#000; text-decoration:none; }
#content p.teaser { margin: 0px 0px 0px 0px; padding: 0px; }

#content div.news { margin:0px 0px 25px 0px; padding:0px; }
#content div.news p.time { margin: 0px 0px 5px 0px; padding: 0px; font-size:0.75em; }
#content div.news h2 { margin: 0px 0px 5px 0px; font-weight: bold; color:#000; }
#content div.news h2 a { margin: 0px 0px 0px 0px; font-weight: bold; color:#000; text-decoration:none; }
#content div.news p { margin: 0px 0px 0px 0px; padding:0px; }
#content div.news p.link { margin: 3px 0px 0px 0px; padding:0px; }
#content div.news a.comments { font-size:0.83em; color:#808080; }

#sidebar { float:right; margin:30px 0px 30px 0px; padding:0px; width:14em; color:#000; background:transparent; }

.sidebarbox { margin: 0px; padding:0px; color:#000; background:#fbfbfb; border: 1px solid #d2ddea; }
.sidebarbox h3 { margin:0px 0px 0px 0px; padding:2px 10px 2px 10px; font-size:0.9em; line-height:1.5em; background:#ebeffa url(images/bg_th.png) repeat-x top; }
.sidebarbox p { margin:10px 0px 0px 0px; padding:0px 10px 10px 10px; font-size:0.9em; line-height:1.5em; }
.subbox { margin-top:30px; }

#sidebar ul { margin: 7px 0px 7px 0px; padding:0px; font-size:0.9em; }
#sidebar li { list-style: none; margin:0px; }
#sidebar li a { margin:0px; padding: 4px 0px 4px 7px; display:block; }
#sidebar li a:hover { text-decoration:none; background:#efefef; }

#search p { }
#searchfield { width:13em; }

table.teaser { }
td.scl { width: 50%; padding-right: 10px; padding-bottom: 25px; vertical-align: top; }
td.scr { width: 50%; padding-left: 10px; padding-bottom: 25px; vertical-align: top; }

#bottomwrapper { clear:both; margin: 0px; padding:0px 30px 0px 30px; background:#f7f7f7; border-top: 1px solid #bacbdf; background-image:url(images/bg_subnav_2.png); background-repeat: repeat-x; }
#bottom { color:#000; }
#bottom p.left { margin: 0px; padding: 0.5em 0 0.8em 0; float: left; font-size:0.75em; }
#bottom p.right { margin: 0px; padding: 0.5em 0 0.8em 0; text-align: right; font-size:0.75em; font-weight: normal; }

#poweredby { position:relative; top:-0.8em; margin:0; padding:0; text-align:center; font-size:0.75em; color:#808080; }
#poweredby a { color:#808080; text-decoration: none; }

.thumbtable { }
.thumbtable td { vertical-align:top; padding:0 25px 20px 0; }
.thumbtable td.last { padding-right:0; }

.thumbtable td p { text-align:center; margin:0; padding:2px 0 0 0; font-size:0.8em !important; line-height:1.2em !important; }
.thumbtable td p.title { margin:0; padding:0; float:left; text-align:left; }
.thumbtable td p.comments { margin:0; padding:0; float:right; text-align:right; }

.below { margin-top:20px; }

ul.spaced li { margin-bottom:0.9em; }

.info { font-size:0.75em !important; line-height:1.19em; border:1px solid red; padding:5px; }

.small { font-size:0.75em !important; line-height:1.19em; }
.smallx { font-size:0.75em !important; line-height:1.19em; color:#808080; }
span.small, span.smallx { font-size:0.9em !important; }

.sep { margin: 20px 0px 10px 0px; padding: 0px; height: 1px; font-size: 1px; width: 200px; border-bottom: 1px dotted #c0c0c0; }

code { font-family:"courier new",courier; color:#000099; }

#comments { margin:40px 0 0 0; }
#comments h3 { font-size:1em; margin: 0 0 20px 0; padding: 0px 0px 2px 0px; border-bottom: 1px dotted #c0c0c0; }
#comments div.comment { margin: 0px 0px 20px 0px; }
#comments p.author { margin: 0px 0px 3px 0px; padding: 0px; font-style: italic; }
#comments p.text { margin: 0px; padding: 0px; }
#comments p.admin { margin: 0px 0 0 0; padding: 3px 0 0 0; font-size:0.75em !important; }
#comments #preview { margin:0; font-size:0.9em; color:red; font-weight:bold; }
#comments div.preview { margin:0 0 20px 0; padding:10px; border:1px dotted red; }
#commentform { margin:0; padding:0; }
#show_commentform { display:none; }

.pagination { font-size:0.82em !important; }
.pagination .current { color:red; }

input.edit_button { font-size:0.75em; width:5em; }
input.delete_button { font-size:0.75em; width:5em; color:red; }

.caution { padding: 0px 0px 0px 20px; color: red; font-weight: bold; background-image:url(images/caution.png); background-repeat:no-repeat; background-position: left; }
.ok { padding: 0px 0px 0px 20px; font-weight:bold; color:red; background-image:url(images/tick.png); background-repeat:no-repeat; background-position: left; }

img { border: 0px; }
img.float-left { float: left; margin: 3px 10px 10px 0px; border: 1px solid black; }
img.float-right { float: right; margin: 0px 0px 13px 13px; border: 1px solid black; z-index:10;}
img.teaser { float: left; margin: 0px 7px 7px 0px; border: 1px solid black; }
img.thumbnail { border: 1px solid black; margin: 0px; }
img.float-left-sm { float: left; margin: 3px 5px 3px 0px; border: 1px solid black; }

a:link { color: #0000cc; text-decoration: none; }
a:visited { color: #0000cc; text-decoration: none; }
a:hover { color: #0000cc; text-decoration: underline; }
a:active { }

img.thumbnail:link { color: #0000ff; border: 1px solid #000000; }
img.thumbnail:visited { color: #0000ff; border: 1px solid #000000; }
img.thumbnail:hover { color: #0000ff; border: 1px dashed #000000; }
img.thumbnail:active { }

a.extern { padding-left:13px; background: url(images/external_link.png) no-repeat left; }
/*a.comments { padding-left:13px; background:url(images/comments.png) no-repeat left; }*/
a.rss { padding-left:16px; background:url(images/rss.png) no-repeat left; }
a.download { padding-left:20px; background:url(images/download.png) no-repeat left; }

a.icon { text-decoration:none; }
a.icon:hover span { text-decoration:underline; }
a.icon img { margin:0px 5px -3px 0px; padding:0px; }

Default Template:



Any ideas?

themarker0
Mar 22nd, 2010, 07:51 PM
Sorry for double post, to many characters in post 1.


<!TYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="<?php echo $lang['lang']; ?>" dir="<?php echo $lang['dir']; ?>">
<head>
<title><?php echo $settings['website_title']; if($page_title): ?> - <?php echo $page_title; elseif($title): ?> - <?php echo $title; endif; ?></title>
<meta http-equiv="content-type" content="text/html; charset=<?php echo $lang['charset']; ?>" />
<meta name="robots" content="<?php if($status>1): ?>index, follow<?php else: ?>noindex, noarchive<?php endif; ?>" />
<meta name="description" content="<?php if($description) echo $description; else echo $settings['default_description']; ?>" />
<meta name="keywords" content="<?php if($keywords) echo $keywords; else echo $settings['default_keywords']; ?>" />
<meta name="generator" content="phpSQLiteCMS <?php echo $settings['version']; ?>" />
<link rel="stylesheet" type="text/css" href="<?php echo BASE_URL; ?>templates/style.css" media="all" />
<!--[if lt IE 7.0]><link rel="stylesheet" type="text/css" href="<?php echo BASE_URL; ?>templates/style_ie.css" media="all" /><![endif]-->
<link rel="alternate" type="application/rss+xml" title="RSS" href="<?php echo BASE_URL; ?>rss" />
<link rel="shortcut icon" href="<?php echo BASE_URL; ?>templates/images/favicon.ico" />
<script src="<?php echo BASE_URL; ?>js/main.js" type="text/javascript"></script>
<?php if($admin): ?>
<script src="<?php echo BASE_URL; ?>js/admin.js" type="text/javascript"></script>
<?php endif; ?>
<script language="javaScript1.2" type="text/javascript" src="http://yesshelter.ca/include/mm_menu.js"></script>
<script language="javaScript" type="text/javascript" src="http://yesshelter.ca/include/navigation.js"></script>
<script language="javaScript" type="text/javascript" src="http://yesshelter.ca/js/functions.js"></script>
<?php if($admin) include('./templates/admin/subtemplates/admin_menu.inc.tpl'); ?>
</head>

<body>
<table border="0" width="100%" cellpadding="0" cellspacing="0" class="supertable">
<tr valign="top">
<td align="right" class="bgleft"><img src="http://yesshelter.ca/images/pixel.gif" width="1" height="1" border="0" /></td>
<td width="845" align="center">

<div class="superdiv">

<table border="0" cellpadding="0" cellspacing="0" class="masthead" align="center">
<tr>
<td><img name="home_r1_c1" src="http://yesshelter.ca/images/masthead/home_r1_c1.gif" width="228" height="20" border="0" alt=""></td>
<td><img name="home_r1_c6" src="http://yesshelter.ca/images/masthead/home_r1_c6.gif" width="22" height="20" border="0" alt=""></td>
<td><a href="default.asp"><img name="home_r1_c7" src="http://yesshelter.ca/images/masthead/home_r1_c7.gif" width="164" height="20" border="0" alt="About Y.E.S."></a></td>
<td><a href="programs.asp"><img name="home_r1_c9" src="http://yesshelter.ca/images/masthead/home_r1_c9.gif" width="167" height="20" border="0" alt="Our Programs"></a></td>
<td><a href="chouse.asp"><img name="home_r1_c11" src="http://yesshelter.ca/images/masthead/home_r1_c11.gif" width="179" height="20" border="0" alt="The Carriage House"></a></td>
</tr>
<tr>
<td><a href="default.asp"><img name="home_r2_c1" src="http://yesshelter.ca/images/masthead/home_r2_c1.gif" width="228" height="125" border="0" alt="YES - Youth Emergency Shelter of Peterborough"></a></td>
<td><img name="home_r2_c6" src="http://yesshelter.ca/images/masthead/home_r2_c6.gif" width="22" height="125" border="0" alt=""></td>
<td><img name="home_r2_c7" src="http://yesshelter.ca/images/masthead/home_r2_c7.gif" width="164" height="125" border="0" alt=""></td>
<td><img name="home_r2_c9" src="http://yesshelter.ca/images/masthead/home_r2_c9.gif" width="167" height="125" border="0" alt=""></td>
<td><img name="home_r2_c11" src="http://yesshelter.ca/images/masthead/home_r2_c11.gif" width="179" height="125" border="0" alt=""></td>
</tr>
<tr>
<td><a href="contactus.asp "><img name="home_r3_c1" src="http://yesshelter.ca/images/masthead/home_r3_c1.gif" width="228" height="24" border="0" alt="Contact Us"></a></td>
<td><img name="home_r3_c6" src="http://yesshelter.ca/images/masthead/home_r3_c6.gif" width="22" height="24" border="0" alt=""></td>
<td><img name="home_r3_c7" src="http://yesshelter.ca/images/masthead/home_r3_c7.gif" width="164" height="24" border="0" alt=""></td>
<td><img name="home_r3_c9" src="http://yesshelter.ca/images/masthead/home_r3_c9.gif" width="167" height="24" border="0" alt=""></td>
<td><img name="home_r3_c11" src="http://yesshelter.ca/images/masthead/home_r3_c11.gif" width="179" height="24" border="0" alt=""></td>
</tr>
</table>

<table border="0" cellspacing="0" cellpadding="0" align="center" class="maintable">
<tr align="left" valign="top">
<td class="col2">
<!-- col2 -->


<table border="0" cellpadding="0" cellspacing="0" class="content2">
<tr><td align="center"><img src="http://yesshelter.ca/images/box_top.jpg" border="0" width="233" height="12" alt="" /></td></tr>
<tr>
<td align="left" class="content2b">


<p style="margin-top:0px;">The <strong>Youth Emergency Shelter</strong> (Y.E.S.) of Peterborough <strong>provides emergency and transitional housing for youth aged 16 to 24 and for families</strong>.
The shelter is located at 196 Brock St., in downtown Peterborough. Call us at <strong><nobr>705-748-3851</nobr></strong>. We are open 24 hours a day, 365 days a week.</p>

<center><img src="http://yesshelter.ca/images/roadmap.gif" width="202" height="230" border="0"></center>

<p><strong>Donate Now Through CanadaHelps.org!</strong></p>
<p><a target="_blank" HREF="http://www.canadahelps.org/CharityProfilePage.aspx?CharityID=d74751"><IMG SRC="http://yesshelter.ca/images/donateNow2b1.gif" BORDER="0" ALT="Donate Now Through CanadaHelps.org!"/></a></p>

<p><img src="http://yesshelter.ca/images/newscover.gif" width="77" height="100" border="0" class="inpageright" align="right">
<strong>Y.E.S. Newsletter! - The Haven</strong>
Read the current version of our newsletter - <a target="_blank" href="http://yesshelter.ca/downloads/YES_newsletter_9.pdf">Winter 2008/2009</a> <br>
<img src='images/small_pdf_icon.gif' alt='Adobe PDF' width='13' height='11' border='0' class='icon'> <small>Adobe (PDF - 4&nbsp;MB)</small><br></p>

<p><strong>Y.E.S. receives provincial recognition</strong> - <a target="_blank" href="/downloads/OPRS-media-release.pdf">view Media Release</a> <img src='http://yesshelter.ca/images/small_pdf_icon.gif' alt='Adobe PDF' width='13' height='11' border='0' class='icon'> <small>Adobe (PDF - 76&nbsp;KB)</small></p>

<p><img src="http://yesshelter.ca/images/albumcover.gif" width="77" height="78" border="0" class="inpageright" align="right">
<strong>Now available: Home For Christmas CD</strong><br>
A collection of 13 seasonal songs performed by some of Peterborough's best musical talent,
with all proceeds to the Youth Emergency Shelter. Available for <strong>$10</strong> at Y.E.S.</p>

<!--
<p>For more information, visit <a href="http://www.HomeForChristmasCD.ca/" target="_blank">www.HomeForChristmasCD.ca</a></p>
-->

</td>
</tr>
<tr><td align="center"><img src="http://yesshelter.ca/images/box_bot.jpg" border="0" width="233" height="12" alt="" /></td></tr>
</table>

<!-- end col2 --></td>
<td class="col1">
<!-- col1 -->

<div id="mainwrapper">
<div id="main">
<?php if($sidebar_1): ?><div id="sidebarwrapper"><?php endif; ?>
<div id="content">

<?php if($breadcrumbs): ?>
<p id="breadcrumbs">&bull; <?php foreach($breadcrumbs as $breadcrumb): ?><a href="<?php echo BASE_URL.$breadcrumb['page']; ?>"><?php echo $breadcrumb['title']; ?></a> &raquo; <?php endforeach; ?><?php if($title) echo $title; ?></p>
<?php endif; ?>

<?php if($page_info): ?>
<p id="pageinfo"><?php echo $page_info; ?></p>
<?php endif; ?>

<?php if($display_time): ?>
<p id="time"><?php echo $lang['page_time']; ?></p>
<?php endif; ?>

<?php if($headline): ?>
<h1><?php echo $headline; ?></h1>
<?php endif; ?>

<?php if(empty($hide_content)) echo $content; ?>

<?php if(isset($subtemplate)) include('./templates/subtemplates/'.$subtemplate); ?>

</div>

<?php if($sidebar_1): ?></div><?php endif; ?>

<?php if($sidebar_1): ?>
<div id="sidebar">
<?php echo $sidebar_1; ?>
</div>
<?php endif; ?>
</div>
</div>

<div id="bottomwrapper">
<div id="bottom">
<p class="left"><?php /* echo $settings['website_footnote_1']; */ ?><?php if($type!='news' && $type!='search' && $type!='notes' && $type!='guestbook') echo $lang['page_last_modified']; ?></p>
<p class="right"><?php echo $settings['website_footnote_2']; ?></p>
</div>
</div>
<?php /* this is for the global content blocks demonstration: */ ?>
<?php if($gcb_1 && isset($gcb[$gcb_1])) echo $gcb[$gcb_1]; ?>
<?php if($gcb_2 && isset($gcb[$gcb_2])) echo $gcb[$gcb_2]; ?>
<?php if($gcb_3 && isset($gcb[$gcb_3])) echo $gcb[$gcb_3]; ?>
<br />
<div id="poweredby">
<a href="http://phpsqlitecms.net/">powered by phpSQLiteCMS</a></div>

</body>
</html>

tomws
Mar 22nd, 2010, 10:22 PM
You didn't explain very clearly. Which of those links is what you want?

The div.content1 css is here:

/* style.css (line 102) */
.content1 {
background-color:white;
padding:0 80px 0 10px;
text-align:left;
}


This is trivially easy to find using Firebug (http://getfirebug.com/).