Image question - Post ID 100781

User 163102 Photo


Registered User
14 posts

I am new to CoffeeCup HTML editor, so this may be a simple question. I am trying to insert an image(in this case a PNG) into a page at a specific point. When I choose the insert image option, the image is a floating image. How do I lock it to a specific position. Basically, I have a title (line of text), enter (to the next line) and then I want to insert the image centered on that line.

Suggestions?

Thanks for the help.

Ron
User 38401 Photo


Senior Advisor
10,951 posts

I'm not sure if I know exactly what you mean by "floating", I insert images all the time with the Insert Image button and they go where I want them for the most part. I do have some graphics on one of the sites in my signature that I had to place in specific spots so that they wouldn't float around the page and so they would go right where I wanted them if that's what you're talking about? If so here's a bit of code that I used and altered to my needs that helped with the graphics on the http://northbaldwinliteracycouncil.org/ site. You can see the example used on the graphic that shows underneath the menu on the site. The menu was made with an external menu maker and needed to be anchored in place so it wouldn't float around too. I had to use the code below example to place the books under it.

<IMG style="Z-INDEX: 100; POSITION: absolute; TOP: 470px; RIGHT: 800px LEFT: 450px" border=0 alt=""
src="url path/filename" width=140 height=85>

forgive my ignorance if this isn't what you mean :)
User 163102 Photo


Registered User
14 posts

I want to have a line of text, hit carriage return, and then on the next line, center a thumbnail image. However,using the image insert capability, I can align the left hand side of the image to the center of that line, but do not seem to be able to center the image in the center of the line.

User 38401 Photo


Senior Advisor
10,951 posts

sounds like maybe you're missing the line breaks maybe? can you place your code in here for the lines you're trying to do so I can see what you're attempting and maybe that way I can see what's missing too.
User 3004957 Photo


Registered User
866 posts

Unfortunately a web page is not like a word document where we can place things using line breaks, spaces and wrapping. Images have to have some kind of reference point or they will end up not rendering exactly where you want them, especially since people have the habit of using sometimes vastly different screen resolutions. The only way to ensure your site looks the way you want it to look is to fix content relative to other content so that it doesn't shift about too much. The easiest way is to use tables and use the cells to contain your content. If you are careful, you can create very complex sites and it doesn't get too messy.

However, gurus frown on tables as being inefficient and, for lack of a better word, lame; they would use pure CSS to position things. This is getting beyond a beginner's brief though. My advice is to think about your site, as in what you want and where you want it and then create a table with as many cells as you need. Then simply put your content in those cells. You can align stuff to the top, middle or bottom as well as left, centre or right and by doing it this way you can position things pretty much where you want them, though there are limitations.

My 2 cents

Dave.
User 122279 Photo


Senior Advisor
14,624 posts
Online Now

Ron, for the future, when you ask for help, it's always best to post an URL to your site, or if the site is not online, post the code for it. That way we would be able to see what you are struggling with and could offer better help.

For a beginner I agree with Dave that with tables you can place everything where you want it to appear.

A crash course in html would also be a good idea if you are new to all this. Here is a good place to start: http://www.w3schools.com/html/default.asp.
Ha en riktig god dag!
Inger, Norway

My work in progress:
Components for Site Designer and the HTML Editor: https://mock-up.coffeecup.com


User 364143 Photo


Guest
5,410 posts

If you are learning html, learn to position using css. Tables should be used for tabular data. If you are learning, learn the current way. CSS positioning isn't any more difficult than using tables and it makes it a whole lot easier to change things around when needed.

Disclaimer: Not a Guru. :P
CoffeeCup... Yeah, they are the best!
User 1054727 Photo


Registered User
3 posts

I wanted to do the same thing and found the code on this page worked:

http://www.w3.org/Style/Examples/007/center.en.html

Have something to add? We’d love to hear it!
You must have an account to participate. Please Sign In Here, then join the conversation.