Need Help Figuring Out How To Add Space Between Image And Text In Body Of WP Site

carpefukendiem · #1 Sep 29, 2010, 09:25 AM

I found this site through a Google search and looked at threats that I thought applied to my problem but I still couldn't figure it out.

I originally had my website outsourced and have been learning CSS for a few weeks now. I've been having trouble figuring out where to change the padding on my external style sheet to adjust the images on my website. I don't want the text to be completely lined up with the image.

I've literally tried to adjust the padding/margin #'s on each individual style (on my external style sheet) to to try to figure this out with no luck. I've been trying to do this for 3 days with no success and plenty o' frustration.

(I must apologize in advance, this is my first attempt at asking for help in a forum and not sure of the etiquette so if I spewed out too much information, sorry.)

here's what I'm talking about:

http://meetruben.com/franchise-alternative

There is no space between the image and the text and this has caused me nothing but frustration. Any help is greatly appreciated.

Here's my style sheet:

body{
margin:2px 5px 2px 0;
padding:2px;
background-image:url(images/body_gr.jpg);
background-repeat:repeat-y;
background-color: #FFFFFF;
background-position:50% top;
font-family:Arial;
font-size:14px;
line-height:1.3em;
font-weight:normal;
color:#00000;
}

#nextprev {
clear: both;
display: block;
text-align: center;
margin-top: 30px;
margin-bottom: 30px;
}

.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}

.alignleft {
float: left;
}

.alignright {
float: right;
}
h1 {
font-size: 20px;
font-weight: bold;
line-height: 1.2em;
font-family: "Palatino Linotype", helvetica, serif, arial;
padding: 5px 15px 2px 15px;
margin: 0 -15px 20px -15px;
}
h4 {
font-size: 14px;
font-weight: bold;
text-align: left;
padding: 3px;
color: #333;
margin-bottom: 5px;
font-family: Arial;
}
h2 { font-size:18px;
margin:0px;
padding:0px 0px 0px 0px;
}

p{
margin-right: 5px;
padding:5px 10px 4px 10px;
text-align:justify;
}

.contentleft a{
color:#000000;
text-decoration:underline;
}

.contentleft a:hover{
color:#000000;
text-decoration:none;
}

/*a{ outline:none;}*/

ul,li{
margin:0px;
padding:0px;
list-style-type:none;
}

ul.posts{
list-style-type:none;
margin:0px 0px 0px 0px;
padding:0px 0px 0px 0px;
}

.posts li{
.post p { line-height: 1.2em; }
list-style-type:none;
background-image:url(images/bullet.jpg);
background-repeat:no-repeat;
background-position:left 7px;
margin:0px;
padding:5px 0px 5px 25px;
}

ul.buttons{
margin:0px;
padding:0px;
list-style-type:none;
}

.buttons li{
margin:0px;
padding:0px;
list-style-type:none;
float:left;
}

/*a{ color: #000000; text-decoration:none; }*/

/* Bgs */

.main{
margin:auto;
padding:0px;
width:971px;
}

.top{
margin:0px;
padding:0px;
width:971px;
float:left;
}

.header{
width:0px;
padding-left:0px;
padding-top:0px;
height:0px;
background:#1E1B16 url(Header.png) repeat-x top;
}

.menu{
position:relative;
margin:-14px 0px 0px 0px;
padding:0px;
height:34px;
float:left;
width:971px;
}

.content{
margin: 0px;
padding: 0px;
background-image:url(images/btsmallbg.jpg);
background-repeat:repeat-y;
width:971px;
float:left;
}

.contentleft{
margin:15px 10px 0px 0px;
padding:0px 35px 0px 35px;
float:left;
width:595px;
}

.contentright{
margin:15px 0px 0px 0px;
padding:20px 0px 20px 0px;
float:right;
width:295px;
background-image:url(images/sidebg.jpg);
background-repeat:repeat-y;
}

.special{
margin:0px; padding:0px;
float:left;
width:295px;
text-align:center;
}

.formore{
margin:15px 10px 15px 10px;
padding:117px 0px 0px 48px;
float:left;
background-image:url(images/optin.png);
background-repeat:no-repeat;
width:227px;
}

.valued{
margin:0px;
padding:20px 0px 20px 0px;
float:left;
width:295px;
text-align:center;
}

.recent{
margin:0px 0px 15px 24px;
padding:8px 0px 12px 15px;
float:left;
background-image:url(images/recent.jpg);
background-repeat:repeat-x;
background-color:#000000;
border:solid 1px #a0a0a0;
width:229px;
}

.formore p{
margin:0px;
padding:0px 0px 10px 0px;
}

.sub{
margin:0px;
padding:15px 0px 0px 100px;
float:left;
}

.res{
margin:0px;
padding:25px 0px 25px 0px;
float:left;
width:210px;
}
/*.fortop{ margin:0px; padding:0px; float:left; height:110px; width:227px;}*/

.bann{
margin:0px;
padding:0px 0px 12px 24px;
float:left;
width:227px;
}

.footer{
margin:0px;
padding:10px 0px 10px 0px;
float:left;
width:971px;
text-align:center;
background-image:url(images/footer_gr.jpg);
background-repeat:repeat-x;
line-height:30px;
font-family:Georgia;
color:#ffffff;
}

/*.footer{ margin:0px; padding:10px 0px 10px 0px; float:left; background-color:#000000; border-bottom: solid 1px #737373;}
*/a.footertext{ font-family:Georgia; font-size:14px; color:#FFFFFF; text-decoration:none;}
a.footertext:hover{ font-family:Georgia; font-size:14px; color:#FFFFFF; text-decoration:underline;}
.footerline{font-family:Georgia; font-size:14px; color:#FFFFFF; padding:0px 20px 0px 20px;}

/* fonts */
.arial18{
font-size:18px;
}

.arial14bo{
font-size:14px;
font-weight:bold;
}

.georgia17{
font-family:Georgia;
font-size:17px;
color:#ffffff;
font-weight:bold;
}

.georgia12white{
font-family:Georgia;
font-size:12px;
color:#ffffff;
text-decoration:none;
}

.textun{
text-decoration:underline;
color:#000000;
}

a.georgia12link{
font-family:Georgia;
font-size:12px;
color:#ffffff;
text-decoration:none;
}

a.georgia12link:hover{
font-family:Georgia;
font-size:12px;
color:#ffffff;
text-decoration:underline;
}

a.georgia14white{
font-family:Georgia;
font-size:14px;
color:#ffffff;
text-decoration:none;
padding:0px 8px 0px 8px;
}

a.georgia14white:hover{
font-family:Georgia;
font-size:14px;
color:#ffffff;
text-decoration:underline;
padding:0px 8px 0px 8px;
}

.sidemain{
margin:0px;
padding:0px 0px 0px 24px;
float:left;
}

#sidebar {
width: 244px;
float:left;
font-family:Arial;
font-size:15px; margin:0px 0px 12px 0px; padding:0px;;
}

.widget {
font:normal 14px Arial;
/*background-image:url(images/bot.jpg);
background-position:left bottom;*/
background-repeat: no-repeat; padding:0px; margin:0px;
background-repeat: no-repeat; padding:0px; margin:0px 0px 10px 0px; border:solid 1px #ffffff;
}

.widget .inner {
padding:0px; float:left;
}

#sidebar h2{
width:227px;
height:30px;
margin:0px;
padding:10px 0px 0px 15px;
font-size:17px;
font-weight:bold;
color:#ffffff;
font-family:Georgia;
background-image:url(images/recent.jpg);
background-repeat:repeat-x;
background-color:#000000;
}

.widget ul{
/*background-image:url(images/mid.jpg);
background-repeat:repeat-y;*/
background-color:#000000;
}

.widget ul ul{
/*background-image:url(images/mid1.jpg);
background-repeat:repeat-y;*/
background-color:#000000;
}

.widget ul li {
padding:6px 0 6px 20px;
width:170px;
margin:0px 0px 0px 20px;
list-style-type:none;
background-image:url(images/bullet.jpg);
background-repeat:no-repeat;
background-position:left 8px;
}

.widget ul li li{
padding:6px 0px 0px 20px;
width:120px;
margin:0px 0px 0px 10px;
list-style-type:none;
background-image:url(images/bullet.jpg);
background-repeat:no-repeat;
background-position:left 8px;
}

.widget a {
color:#ffffff;
text-decoration:none;
}

.widget a:hover {
color:#d9ae14;
}

thanks in advance for your help.

-carpefukendiem

lmilesw · #2 Sep 29, 2010, 10:10 AM

The only problem is that this is a forum for the Atahualpa theme and the Themeframe theme builder.

Please see PM.