Placing 2 images side by side in a div and not hving a gap between them

I'm building my first website http://www.ClayBernard.com and having a problem in the div "#logoAndBanner" - when I place 2 images side by side I get a gap so in the browser they look disjointed. I want to make them seamless.
Any ideas would be great
Thanks

Hi,
what's about this:
<div id="logoAndBanner"><a href="index.html"><img src="images/BANNERS/IndexBanner_rev00.png" width="1000" height="80" border="0" /></a><img src="images/BANNERS/Banner_Contact_rev00.png" width="100" height="80" border="0" /></div>
Hans-G.

Similar Messages

Placed PNG images which are made in 3ds max are not shown correctly in Ilustrator

Hello,
Why placed PNG images (renders) which are made in 3ds max (and then photoshoped) are not shown correctly in Ilustrator. Images appear very noise so you can't see almost a thing. the same pictures (renders) made in Revit appear ok.
Is there a solution to solve this issue?
Thanks.

You would have to provide screenshots of how it looks in PS, including the channels visible. MAX may have embedded extra channels that throw off AI. And of course check whether your PNG is actually 8bit, not 16bit.
Mylenium

I wanted to transfer 4000 photos from my PC to my IPOD and IPAD, I did this but I thought the images would be still in their folders and not in an individual format, how do I retain the folder structure and transfer?

I transferred my photos from my PC to my IPOD and IPAD, c. 4000. I thought they would be transferred in the existing folders, all I got was 4000 individual photos, how do I retain the folder structure?

If you are syncing a number of folders from your computer then each folder should get it's own album on the iPad (http://support.apple.com/kb/HT4236) - I assume that you've touched the 'Albums' button at the top of the Photos app so as to view them by album, and not just the Photos 'button'.
You could try closing the Photos app completely and then re-opening it : from the home screen (i.e. not with Photos 'open' on-screen) double-click the home button to bring up the taskbar, then press and hold any of the apps on the taskbar for a couple of seconds or so until they start shaking, then press the '-' in the top left of the Photos app to close it, and touch any part of the screen above the taskbar so as to stop the shaking and close the taskbar.
Another option is to try a reset : press and hold both the sleep and home buttons for about 10 to 15 seconds (ignore the red slider), after which the Apple logo should appear - you won't lose any content, it's the iPad equivalent of a reboot.

Placing Images side by side

Hi Guys
I want to place 2 images side by side in my div and would like to know the easiest way to do this. I did have a table before which did the job but something went wrong and my table could only be placed in the div as an Ap Div which I do not want as on certain browsers it would move around.
Could anyone help please?
Many thanks!

The rule that applies to those images is this -
.main img {
    clear:both;
    float:left;
    padding:5px;
    border:1px solid #FFF;
    margin-top: 10px;
    margin-right: 10px;
    margin-bottom: 10px;
    margin-left: 0;
It will apply to ANY image within the .main container, including those within .mail-navigation, so you may not want to make changes to it.
My last fix should have also worked - did it?

Image in photoshop transparent and not showing image selected.

My images are appearing in Photoshop as 'transparent' and not as the image selected. This is following a major fault created by hardware supplied to me which caused me to have to re-format my computer.

Microcord,
Did you try posting something via e-mail? All I see is a blank reply in the thread.
Sometimes, e-mail/ attachments sent via e-mail never reach the forum. Please login to http://forums.adobe.com and respond to your post.
-ST

Putting two separate images side by side in the same document

Hello
I'm new to the community and hope I'm posting this question in the right area.
I've downloaded the 30 day free trial of Photoshop CC 2014 and I'm attempting to put 2 separate images side by side in the same document based on an instructional video I watched on Lynda.
I know of one way to do this but, the Lynda's instructor method made things look so much easier and quicker to do.
He didn't create a new canvas or make any image size adjustments.
He basically imported 2 images, used the move tool to drag the open image and drop it in the the tab heading of the other image.
After doing that, he ended up with two layers, the background layer and the "layer 1" layer.
He then was able to use the move tool again to position layer 1 in the document and then use the expand all option (I think it was) so both images were visible side by side.
He moved the layer 1 layer to the far left that it almost wasn't visible and that's why he used the expand all function.
The problem I'm running into is, I'm not getting the "layer 1" after doing the drag and drop.
The only layer I have is the background layer.
The odd thing is, that was the only layer he had as well after he did the drag and drop.
But, after he gave the tip of holding the shift key while the drag and drop was being done to center the images, it was then, the layer 1 layer appeared in his layers pallet.
I tried holding the shift key as well and I still can't get the layer 1 to appear.
I've watched the video a few times to see if I missed something he did and i can't see that I have.
How do I get layer 1 to appear so I can complete the rest of the process described in the video?
If any members here have full access to the Lynda videos, this is the one I watched:
The instructions for this particular process is about half way through the 4 minute video.
I've sent basically the same question to Lynda but it could take up to 3 business days for a reply and I was hoping someone here might have an answer sooner.
Watching:
Combining multiple images together as layers
From:
Photoshop CC for Photographers: Fundamentals
with Chris Orwig

Trevor,
Fleming doesn't want to extend the canvas, mind you.
P Fleming wrote:
He didn't create a new canvas or make any image size adjustments.
He also doesn't want to drag layers but drag image tabs.
And the video tutorial ends up with two different images on top of each other, contrary to his initially desired "side by side" arrangement.
It's all for the birds, IMO.

Centre text and image side by side.

Hi, I was able to centre two images side by side fine with my old website page but once I changed one of the images into text I cant seem to align them side by side anymore.
Old (image next to image):
http://dkphotos.net/About/About.html
New (text next to image):
http://dkphotos.net/AboutNew/About.html
Any help would be very appreciated.
HTML:
<!doctype html>
<html>
<head>
<link rel="shortcut icon" href="favicon.ico" >
   <link rel="icon" type="image/gif" href="../../animated_favicon1.gif" >
<title>About</title>
<meta charset="UTF-8">
<link rel="stylesheet" type="text/css" href="layout.css">

<script src="http://code.jquery.com/jquery-latest.min.js">
</script>
          <script type="text/javascript" src="//code.jquery.com/jquery-latest.js"></script>
          <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.4/jquery-ui.min.js"></script>
<script src="js/jquery-1.7.2.min.js"></script>
<style type="text/css">
<style>
body,td,th {
              font-family: "josefin-slab";
          font-style: normal;
          font-weight: 400;
          font-size: 15px;
          color: #444444;
/**LINKS**/
a {
font-family: "Josefin Slab";
font-size: 15px;
font-weight:400;
text-decoration:none;
color: #777777;
a:link {
          color: #444444;
          font-style: normal;
          font-weight: 400;
          font-family: josefin-slab;
          font-size: 15px;
a:visited {color: #444444;}
a:hover {color: #60baec;}
a:active {
          color: #444444;
          font-style: normal;
          font-weight: 400;
          font-family: josefin-slab;
          font-size: 15px;
a:focus {color: #60baec;}
ul {
list-style:none;
margin:0;
padding:0;
li {float:right; padding-right: 30px}
body,td,th {
          font-family: josefin-slab;
          font-style: normal;
          font-weight: 400;
          font-size: 15px;
          color: #444444;
abou
p1 {
          font-family:josefin-slab;
          font-style:normal;
          font-weight:400;
          font-size:18px;
          color:#444444;
p2 {
          font-family:josefin-slab;
          font-style:normal;
          font-weight:400;
          font-size:18px;
          color:#444444;
</style>
<script type="text/javascript">
function MM_preloadImages() { //v3.0
var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array();
    var i,j=d.MM_p.length,a=MM_preloadImages.arguments; for(i=0; i<a.length; i++)
    if (a[i].indexOf("#")!=0){ d.MM_p[j]=new Image; d.MM_p[j++].src=a[i];}}
function MM_swapImgRestore() { //v3.0
var i,x,a=document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc;
function MM_findObj(n, d) { //v4.01
var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) {
    d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p);}
if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n];
for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document);
if(!x && d.getElementById) x=d.getElementById(n); return x;
function MM_swapImage() { //v3.0
var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3)
   if ((x=MM_findObj(a[i]))!=null){document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2];}
</script>

<script>var __adobewebfontsappname__="dreamweaver"</script>
<script src="http://use.edgefonts.net/josefin-slab:n1,n4:default.js" type="text/javascript"></script>
</head>
<body>
<div class="wrapOverall">
<div class="container" id="headerContainer">
   <div class="header"><a href="../Home/Home.html"><img src="images/Home-Page_03.png" width="448" height="69" class="logo" id="Logo" onMouseOver="MM_swapImage('Logo','','images/home_03-roll-over.png',1)" onMouseOut="MM_swapImgRestore()" alt="Dovydas Kaltanas"/></a></div>
<div class="navMain">
          <div class="navMain">
<ul class="navBar"
    style="width: 530px; float: right; font-weight: 400; font-family: josefin-slab; font-style: normal;">
                    <li><a href="Contact.html">CONTACT</a></li>
                    <li><a href="">BLOG</a></li>
                    <li><a href="../About/About.html">ABOUT</a></li>
                    <li><a href="">PRICING</a></li>
                    <li><a href="../Portfolio/Portfolio.html">PORTFOLIO</a></li>
                    <li><a href="../Home/Home.html">HOME</a></li>
          </ul>
        </div>
</div>
</div>

<div id="Container">
<div id="leftAbout">
<p1>Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text Text </p1>
                              <p2><br /><a href="../CurriculumVitae.pdf">Curriculum Vitae</a></p2>
</div></p></div>
<p></p>
<p><div id="rightAbout"><img src="images/profile.jpg" width="450" height="736">
<p></p>
</div>

<div id="containerFooter">
<div id="Box1" style="font-family: 'Josefin Slab'">
<p>All content <span style="font-size: 20px">©</span> DKphotos 2013</p>
</div> 
<div id="Box2">
<p><script type="text/javascript">
// BeginOAWidget_Instance_2149022: #OAWidget
          var urlToLike = 'http://www.facebook.com/DKphotos.net';
          if (urlToLike == '') {
            urlToLike = window.location.href;
      urlToLike = encodeURIComponent(urlToLike);
      var font = encodeURIComponent('arial');
document.write ('<iframe src="http://www.facebook.com/widgets/like.php?locale=en_US&href='+urlToLike+'&layout=button_cou nt&show_faces=false&width=450&height=150&action=like&font='+font+'&colorscheme=light" scrolling="no" frameborder="0" allowTransparency="true" style="border:none; border-color:#ffffff; overflow:hidden; width:450; height:150"></iframe>')
// EndOAWidget_Instance_2149022
</script>
</div>
</div> 

<hr class="clearing" />
</div> 
</div>
</body>
</html>
CSS:
@charset "utf-8";
/* CSS Document */
body {
          background-image:url(images/bg_body.jpg);
          background-color:#ffffff;
          background-attachment:fixed;
          background-position:top;
.wrapOverall {
          width: 1920px;
          display: inline;
img { border: 0; }
ul.navBar {
margin: 18px 0px 0px 0px;
padding: 0;
white-space: nowrap;
width: 950px;
overflow-x: auto;
display:inline-block;
ul.navBar li {
          display:inline;
.header img.logo{
          float: left;
          margin: 0px 15px 0px 15px;
.container {
          min-width: 1050px;
#Container {
font-family: Verdana, Arial, Helvetica, sans-serif;
border: 0;
width: 900px;
margin:0 auto; /*centered*/
overflow:hidden; /*float containment*/
#Container {
     clear:both;
     width: 100%;
     min-width: 900px;
#left {
          width: 300px;
          min-height: 550px;
          margin-bottom: 200px;
          border: 0;
          /*to reduce float drop issues in IE*/
          word-wrap: break-word;
          margin-left: auto;
    margin-right: auto;
#ContentBox1 {
          width: 450px;
          min-height: 550px;
          margin-bottom: 200px;
          border: 0;
          /*to reduce float drop issues in IE*/
          word-wrap: break-word;
          margin-left: auto;
    margin-right: auto;
/**Clear floats after the boxes**/
.clearing {
clear:both;
visibility:hidden;
line-height:0;
font-size:1px;
display:block;
#containerFooter {
width: 100%;
min-width: 650px;
max-width: 100%;
color:#444444;
font-style:normal;
font-weight:400;
font-family:josefin-slab;
font-size:15px;
text-decoration:none;
#containerFooter {
font-family:josefin-slab;
border: 0;
margin:0 auto; /*centered*/
overflow:hidden; /*float containment*/
#Box1, #Box2 {
          width: auto;
          min-height: 10px;
          border: 0;
          /*to reduce float drop issues in IE*/
          word-wrap: break-word;
#Box1 {margin-left: 8px; float: left;}
#Box2 {margin-left: 20px; float: left;}
/**Clear floats after the boxes**/
.clearing {
clear:both;
visibility:hidden;
line-height:0;
font-size:1px;
display:block;
          #containerFooter {
                    width:100%;
                    float:left;
                    #containerFooter {
          position: fixed;
          bottom: -145px;
          z-index: 500;
          background-color: #FFF;

Overall width of the website is 1920px???? That's way too wide.
Anyways you would need to 'float' the leftAbout and rightAbout containers if you want the text to be to the left of the image:
#headerContainer {
    overflow: hidden;
#leftAbout {
    float: left;
    width: 400px;
#rightAbout {
    float: left;
    width: 450px;
#containerFooter {
    clear: both;
I'll leave you to ajdust the width of the text container - leftAbout

How do I view images side by side in CS6?

In Photoshop CS5 I could click on a button to view images side by side or above and below. In CS6 my button is gone. How do I view images side by side/above and below?

Go to the menus: Window - Arrange - xxx
-Noel

How can i split the edit screen to have the same image side by side?

In other words I want to have the before and after right next to each other
thanks in advance!

In Quick and Guided modes there is a View: Before and After; however, if Expert mode, there is no such view.
In Export mode what you can do is open the Photo Bin, and right-click Duplicate, then choose Window / Tile and see the two images, side-by-side. Then you can do your edits on one of the two images and the other will remain the same.

How do I convert raw images with side car to Dng and

How do I convert raw images with side car to Dng and preserve the sidecar info in the DNG?
I have tons of raws + xmp sidecars that i want to convert to dng, because the raws are from different camera brands and i want to get everything simplified. so that i do not have to worry if I will be able to access the raws in the future, if I decide I want to rework some of the files.
T.I.A.

If the images are already in your catalog you can select them then choose Convert Photos to DNG from the Library menu. You'll be given the option of deleting the original raw files. Either way, Lr will only display the newly created DNG files.
The alternative, which is better suited to images not already in the catalog is to use the Adobe DNG Converter

Photo Elements 12, Mac OS X 10.9.5, Trying to combine two images side by side, same height. Get this message: "Panorama could not be created as some images could not be automatically aligned". Tried with several different images, same height each combo

Photo Elements 12, Mac OS X 10.9.5, Trying to combine two images side by side, same height. Get this message: "Panorama could not be created as some images could not be automatically aligned". Tried with several different images, same height each combo

One does not "see" the images when selecting; You just select two file names, click OK, PhotoShop does the rest, and comes back with same message.

How to place 6 images side by side

Greetings! I am trying to put 6 images side by side in dreamweaver and I realized I never learned how to do this. I've done it with 2 images but not 6. Here's the coding...
<div class="containterx">
            <div>
             <h3>Back Pain</h3>
              <a href="#"><img src="images/backpain.jpg" alt="Image 11" width="147" height="105" class="img-responsive img-rounded img_bottom" /></a>
              <p><a class="btn-sm btn-primary" href="#">Details »</a></p>
            </div>
            <div>
              <h3>Arthritis</h3>
              <img src="images/arthr.jpg" alt="Image 12" class="img-responsive img-rounded img_bottom" />
              <p><a class="btn-sm btn-success" href="#">Details »</a></p>
           </div>
            <div>
             <h3>Ankle Pain</h3>
              <img src="images/ankle.jpg" alt="Image 13" width="114" height="149" class="img-responsive img-rounded img_bottom" />
              <p><a class="btn-sm btn-primary" href="#">Details »</a></p>
            </div>
    <div>
<h3>Carpal Tunnel</h3>
                <img src="images/carpal.jpg" alt="Image 14" width="161" height="110" class="img-responsive img-rounded img_bottom" />
                <p><a class="btn-sm btn-success" href="#">Details »</a></p>
        </div>
            <div>
             <h3>Elbow Pain</h3>
                <img src="images/elbow.jpg" alt="Image 15" width="170" height="130" class="img-responsive img-rounded img_bottom" />
                <p><a class="btn-sm btn-success" href="#">Details »</a></p>
            </div>
        <div>
<h3>Imflamation</h3>
                <img src="images/inflamation.jpg" alt="Image 16" width="167" height="167" class="img-responsive img-rounded img_bottom" />
            <p><a class="btn-sm btn-primary" href="#">Details »</a></p>
         </div>
        </div>
Thanks a bunch!

View source in browser to see the code.
Alt-Web Templates :: CSS Semi-Liquid, Photo Proof Sheet
Nancy O.

Place images side by side

Hi all, how would you create a script to place images side by side from left to right in a psd file, the images are the same size 256x256px and there can be as many as 50 images.
Thank you.

This might be of use..
http://www.ps-scripts.com/bb/viewtopic.php?t=2489

Viewing Images Side by Side in Elements 11

How do I view images side by side in Elements 11 Organiser. In Elements 9 it was easy but I can't find it in Elements 11 or am I being stupid?

By side by side I mean just one image next to another image.
In media view I can view as many or as few images as I chose by the zoom slider except for just 2 images which I wish to compare for finer detail.

Button to show images side-by-side missing from Photoshop CS6 toolbar

In Photoshop CS6, a very important button is missing from the toolbar — the one to show two images side-by-side or above-and-below, and multiple images in other arrangements. I need this button — it’s an important part of my. (BTW, the button is still in Illustrator CS6.)

MikeKPhoto wrote:
the changes have negatively impacted productivity
I'm not seeing that, and I can't agree with your assessment. In using it all day every day since the public beta was made available, Ps CS6 has clearly improved my ability to go from raw file to finished product more quickly and reliably, and with better results at the end. It's not THAT hard to re-learn where to find the window arrangement functions - give it a week. Positionally the menu is almost in the same place the button used to be.
MikeKPhoto wrote:
By the way, do we not have a Customer Advocate, that is supposed to be on our side, notably absent from many, if not all, of these threads
What gave you this idea? I've never heard of such a person. User forums are just full of other users trying how best to use the software, occasionally trying to help others do the same...
-Noel

Placing 2 images side by side in a div and not hving a gap between them

Similar Messages

Maybe you are looking for