Title: CSS help needed please
Last modified: August 18, 2016

---

# CSS help needed please

 *  [jbickers](https://wordpress.org/support/users/jbickers/)
 * (@jbickers)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/)
 * Hi all, I’m hoping some kind soul here will want to give some advice to a total
   CSS newbie …
 * I’ve just installed WordPress for a friend of mine, and used one of the stylesheets
   from Alex King’s site. Here’s where it’s located:
 * [http://www.lesliestewart.com/blog](http://www.lesliestewart.com/blog)
 * There are two things I want to accomplish, but have no idea how: (1) correct 
   the padding on images so that text doesn’t touch their left side, and also have
   all images default to right-alignment; and (2) add a second line of text under
   the title.
 * Any help is gratefully appreciated, and will be repaid with many good thoughts:
   >
 * James

Viewing 7 replies - 1 through 7 (of 7 total)

 *  [kinuk](https://wordpress.org/support/users/kinuk/)
 * (@kinuk)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/#post-142552)
 * To solve number one, put the following into your stylesheet:
 * img {padding: 5px;}
 * change the number to change the amount of padding around the photo.
 * You can also add another line under the title by adding padding. (padding-bottom:
   5px;), for example.
 *  [ifunky2](https://wordpress.org/support/users/ifunky2/)
 * (@ifunky2)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/#post-142652)
 * James that post above mine will do nothing for you.
    Images used/ positioned 
   with css will not be effected by padding. you can alter the position within the
   css in many ways check this link [ W3c back ground properties ](http://www.w3schools.com/css/pr_background-position.asp)
   you can state the div, then a bg in that div >> #myimagediv{ background: #color
   url(mypicture.jpg) 12px 24px fixed; this would position the image 12pixels right
   from left border (x) and 24 pixels down from the top (y) as well the “fixed” 
   property would make it non scrolling. the long handed way would be>> #div{background:#
   ffffff url(myimage.jpg); background-position: left/**center/top/bottom etc or……
   background-position: x-12px /**or em, pt, %, inches, mm etc**/ background-repeat:
   no-repeat; /** if you don’t want it to tile **/ James on your page it looks like
   the easiest solution would be to add (left) margin to the division containing
   your image, in order to move the text away from the image. Or as well you could
   use right margin on the paragraph tag for the text.
 *  [dkuehne](https://wordpress.org/support/users/dkuehne/)
 * (@dkuehne)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/#post-142658)
 * James,
    You’ll need to get a book on this subject or learn online if you really
   want to get a handle on CSS. Try anything from Zeldman or Eric Meyer. First off
   though, the site you want to emulate doesn’t utilize CSS properly, so I wouldn’t
   of necessity follow what they’ve done–maybe just the look–or their stylesheet–
   but not their markup (I really haven’t looked at thier styles). Notice I said“
   utilize.” If they really were using CSS properly they wouldn’t have marked their
   page up the way they did. A margin is what you need, my man.
 * 1.) You read right–margin not padding. Padding goes between the content and a
   border–if you had one. The margin is on the outside of the border (again, if 
   you have a border). Learn the “box model” and you’ll be on your way. The site
   you gave is using the `align="right"` to put the photo to the right. Don’t do
   it that way.
 * For a photo that floats right with the text wrapping around it, do this in your
   markup (before a paragraph or heading, etc.):
 * `<div class="photoright"><img src="image.jpg" alt="whatever" title="whatever"/
   ></div>`
 * In your stylesheet you will make this declaration:
 * `.photoright {
    float: right; margin: 0 0 10px 10px; border: 1px solid #666; /*
   if a border is desired */ }
 * Adjust the margins as you see fit so that the text flows around the photo as 
   you see fit. Make the border any color you’d like. #666 is the shorthand for #
   666666.
 * Sure, you can float just the img and declare all images as block elements (a 
   good idea anyway) but with the photo in a div you have more “hooks” as it were
   for styling and you can also put a caption with the photo and the whole thing
   floats as a unit. If you wanted to use padding and gave the background a color,
   padding would allow the background to show through. Best way to learn is to experiment.
   Try an editor that allows you to see your changes in real time too. You can use
   Firefox and use the “Developer Tools” plugin that’s on their site for real-time
   CSS editing if you wish. You can even edit other sites in real-time.
 * There is no need for absolute positioning, etc.
 * Note: that the photoright declaration is a class. You mentioned that you’d want
   all your photos to be right-aligned. This will “float” all your photos to the
   right. Being a “class” you can use this same `<div>` class as many times as you’d
   like on the page. That’s the power of CSS. You don’t want to do what the above
   gentleman wrote, and set up images into the background of divs every cotten-picken
   time you post a photo. This would mean an edit to the stylesheet just to post
   a photo–absurd!
 * About the second line of text thing… I assume you want a sub-heading? Then an`
   <h2>` would be in order. Style the headings (h1-h6) any way you’d like and you’re
   good to go.
 * Hope this helps.
 * –Dave K.
 *  [shiner25](https://wordpress.org/support/users/shiner25/)
 * (@shiner25)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/#post-142824)
 * where is alex site is there templates there?
 *  Moderator [James Huff](https://wordpress.org/support/users/macmanx/)
 * (@macmanx)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/#post-142826)
 * Templates/Designs for v1.2.x:
    [http://wordpress.org/support/topic.php?id=20279](http://wordpress.org/support/topic.php?id=20279)
 * Themes for v1.5gamma:
    [http://codex.wordpress.org/Using_Themes#Get_New_Themes](http://codex.wordpress.org/Using_Themes#Get_New_Themes)
 * Specifically, Alex King’s site: [http://www.alexking.org/index.php?content=software/wordpress/styles.php](http://www.alexking.org/index.php?content=software/wordpress/styles.php)
 *  Thread Starter [jbickers](https://wordpress.org/support/users/jbickers/)
 * (@jbickers)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/#post-142994)
 * dkuehne, I’ve taken your advice – but to no avail. I’ve created the .photoright
   class in my CSS file, and added the DIV tag to the image – looking at the source
   of the page generated, I see the DIV tag is there, but it’s not formatting the
   image. Any thoughts?
 * Best,
    James
 *  [dkuehne](https://wordpress.org/support/users/dkuehne/)
 * (@dkuehne)
 * [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/#post-143055)
 * James, I just copied what I posted earlier (the div and style declaration) into
   a document to test it (because I wrote it from memory–I’ve used it many times).
   Well, guess what? It worked. So… you must be leaving something out or putting
   something in that shouldn’t be there.
 * If I could look at your markup and stylesheet, that would help.
 * `</davekuehne>`

Viewing 7 replies - 1 through 7 (of 7 total)

The topic ‘CSS help needed please’ is closed to new replies.

 * 7 replies
 * 6 participants
 * Last reply from: [dkuehne](https://wordpress.org/support/users/dkuehne/)
 * Last activity: [21 years, 3 months ago](https://wordpress.org/support/topic/css-help-needed-please/#post-143055)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics
