Solved

I have tried to input image in the box but it is not working I would like to have a image in every box on the right side

Posted on 2009-05-19
10
194 Views
Last Modified: 2013-12-25
<html>
 
 <head>
 
<STYLE>
 
#outer { background: #EEE;
         width: 800px;
         height: 480px; }
#left  { background: #DDD;
         height: 440px;
         width: 300px;
         margin-top: 40px;
         float: left; }
#right { background: #DDD;
         float: right; }
#right DIV { background: #CCC; margin-top: 40px; }
#right DIV DIV {
  background: #BBB;
  height: 120px;
  width: 120px;
  float: right; }
#right DIV DIV:first-child {
  float: left;
  margin-right: 40px;
}
</STYLE>
 
</head>
 
 <body>
  <div id="outer">
 
   <div id="left"nonselectableobject" style="font-size:12px;font-weight:bolder;">
We have talk to churches and yes, we know.. no budget for your membership website, it is constantly out of date, "Date BC", your web designer takes too long to make changes and your staff or volunteers aren't exactly techies or they have left the church!
</div>
   
   <div id="right">
     <div id="r1" style="margin-top:1;">
     <div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     <div>2</div>
     </div>
     <div id="r2">
     <div>3</div>
     <div>4</div>
     </div>
     <div id="r3">
     <div>5</div>
     <div>6</div>
     </div>
  </div>
 
 </body>
 
</html>
0
Comment
Question by:jamesccnacmp
  • 5
  • 2
  • 2
10 Comments
 
LVL 13

Expert Comment

by:qwerty021600
ID: 24428977
Can you be more clear?
Are u referring to digits as images?
0
 

Author Comment

by:jamesccnacmp
ID: 24430921
Did you see the html code? Will I am sending a attachment so you can see what I am tying to do.
box.txt
0
 
LVL 13

Expert Comment

by:qwerty021600
ID: 24430933
But the one image u placed is already coming at right.. so which other images u want to be right aligned?
0
 

Author Comment

by:jamesccnacmp
ID: 24431024
I need your help, when tried I to run this code the position of the box changed how do correct it?
I have send you attachment. this file for the Web Gallery on page 6, I would like to show the web page on each page. I will be place other image in each box. If you try to use the same image I have in the html code you will see what I am talking about.
0
DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

 

Author Comment

by:jamesccnacmp
ID: 24432875
I add more image to this code

<html>
 
 <head>
 
<STYLE>
 
#outer { background: #EEE;
         width: 800px;
         height: 480px; }
#left  { background: #DDD;
         height: 440px;
         width: 300px;
         margin-top: 40px;
         float: left; }
#right { background: #DDD;
         float: right; }
#right DIV { background: #CCC; margin-top: 40px; }
#right DIV DIV {
  background: #BBB;
  height: 120px;
  width: 120px;
  float: right; }
#right DIV DIV:first-child {
  float: left;
  margin-right: 40px;
}
</STYLE>
 
</head>
 
 <body>
  <div id="outer">
 
   <div id="left"nonselectableobject" style="font-size:12px;font-weight:bolder;">
We have talk to churches and yes, we know.. no budget for your membership website, it is constantly out of date, "Date BC", your web designer takes too long to make changes and your staff or volunteers aren't exactly techies or they have left the church!
</div>
   
   <div id="right">
     <div id="r1" style="margin-top:1;">
     <div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     </div>
     <div id="r2">
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     </div>
     <div id="r3">
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     </div>
  </div>
 
 </body>
 
</html>
0
 

Author Comment

by:jamesccnacmp
ID: 24432895
I add more image to this code to show you my problem.

<html>
 
 <head>
 
<STYLE>
 
#outer { background: #EEE;
         width: 800px;
         height: 480px; }
#left  { background: #DDD;
         height: 440px;
         width: 300px;
         margin-top: 40px;
         float: left; }
#right { background: #DDD;
         float: right; }
#right DIV { background: #CCC; margin-top: 40px; }
#right DIV DIV {
  background: #BBB;
  height: 120px;
  width: 120px;
  float: right; }
#right DIV DIV:first-child {
  float: left;
  margin-right: 40px;
}
</STYLE>
 
</head>
 
 <body>
  <div id="outer">
 
   <div id="left"nonselectableobject" style="font-size:12px;font-weight:bolder;">
We have talk to churches and yes, we know.. no budget for your membership website, it is constantly out of date, "Date BC", your web designer takes too long to make changes and your staff or volunteers aren't exactly techies or they have left the church!
</div>
   
   <div id="right">
     <div id="r1" style="margin-top:1;">
     <div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     </div>
     <div id="r2">
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     </div>
     <div id="r3">
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     <div><div><img src="#WORKSPACE_IMAGES#ch001.bmp"alt=" /><br></div>
     </div>
  </div>
 
 </body>
 
</html>
0
 
LVL 70

Expert Comment

by:Jason C. Levine
ID: 24435709
jamesccnacmp,

Without seeing the images as well it is hard to assist you.  Please post a link to a page so I can see it in action with images and I will take a look.
0
 

Author Comment

by:jamesccnacmp
ID: 24438167
here is the image
ch001.bmp
0
 
LVL 70

Accepted Solution

by:
Jason C. Levine earned 500 total points
ID: 24438302
Thanks.  Can you re-read my comment above again and post a link to the page?  I can test your CSS using debugging tools in Firefox and solve your problem faster if you do so...
0

Featured Post

DevOps Toolchain Recommendations

Read this Gartner Research Note and discover how your IT organization can automate and optimize DevOps processes using a toolchain architecture.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Not sure what the best email signature size is? Are you worried about email signature image size? Follow this best practice guide.
Any business that wants to seriously grow needs to keep the needs and desires of an international audience of their websites in mind. Making a website friendly to international users isn’t prohibitively expensive and can provide an incredible return…
In this tutorial viewers will learn how to embed videos in a webpage using HTML5. Ensure your DOCTYPE declaration is set to HTML5: "<!DOCTYPE html>": Use the <video> tag to insert a video. Define the src as the URL of your video; this is similar to …
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…

895 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

14 Experts available now in Live!

Get 1:1 Help Now