WordPress.org

1. ReginaldTerrell
   Member
   Posted 1 year ago #
   

   So i did this post but my images aren't aligning next to each other.

   i did this:

   <img src="img url"> <img src="img url">

   i do have enough space for images to align next to each other but for some reason the images are going to a whole different line, what must i add to the css to get them to align

   here is the code for the div my post are in

   .entry{
           background: url(http://tiffanyevansdaily.net/wp-content/uploads/2011/10/postbody.jpg) repeat;
           padding: 10px 11px 8px 10px;
           color:#b8b8b8;
           text-shadow: #fff 1px 1px 1px;

   [No bumping, thank you.]

2. vtxyzzy
   Member
   Posted 1 year ago #
   

   Try giving each image a float: left; style.

3. Lorelle
   Member
   Posted 1 year ago #
   

   Just trying to understand what you are trying to do. vtxyzzy has offered one solution, but you are trying to control the post entry or an image within the post entry?

   Without a page too look at or more specifics, this is hard to answer.

   Images wrap down lines because the line or container they are in isn't wide enough to accommodate them. You can edit the CSS to create a new style for those images (don't change the core styles as that will change EVERYTHING and you only want to change these images, right?). Make the padding and margins around those images narrower so they will fit on the line, and consider resizing them if that is a possible option.

   Without more information, it's hard to know how to answer this right.

4. ReginaldTerrell
   Member
   Posted 1 year ago #
   

   Hey i'm sorry for my late respnonse but i stop checking cause no one was helping, but i'm happy that you all are and yes i do have an example.

   http://tarajiphensondaily.com/hq-gallery-update-taraji-63rd-emmy-awards/

   see how the thumbnails are aligning under each other, how do i get them to align next to each other

5. dragonsjaw
   Member
   Posted 1 year ago #
   

   I would do as vtxyzzy said and try adding
   float:left;
   to the entry img below..

   .entry img {
   
   	background:#fff;
   
   	padding:7px;
   
   	margin:1px;
   
   	-moz-border-radius:6px; 
   
   	-webkit-border-radius:6px; 
   
   	border-radius:6px;
   
   	border:1px solid #e0e0e0;
   
   	box-shadow: 0px 0px 7px #958365;
   
   	-webkit-box-shadow: 0px 0px 7px #e6e6e6;
   
   	-moz-box-shadow: 0px 0px 7px #e6e6e6;
   
   	}

6. ReginaldTerrell
   Member
   Posted 1 year ago #
   

   i added float left but it made the footer of the news content float alongside the images

7. ReginaldTerrell
   Member
   Posted 1 year ago #
   

   and also it made the image that i already had align center float left as well

8. ReginaldTerrell
   Member
   Posted 1 year ago #
   

   So i figured it out, although with this method i i have to do a little extra work.

   I added this to my css

   div.img
   {
   margin: 2px;
   border: 0px solid #0000ff;
   height: auto;
   width: auto;
   text-align: center;
   }
   div.img img
   {
   display: inline;

   }

   Then in the post i added this

   <div class="img"><center> <img src="IMG URL HERE"><img src="IMG URL HERE"><img src="IMG URL HERE"></center></div>

   and it aligned my images next to each other :)

Topic Closed

This topic has been closed to new replies.