Jump to content

Inserting headlines, paragraph text with image


David104

Recommended Posts

Hi,

 

I hope someone out there can help me. I have a layout where I have an H5 + a P that looks fine. The problem start when I try to insert an image in the layout. I can insert an image Float it to the Left, set the margins and all and the H5 jumps to the top (right) like it should but the P text stays under the image and the only way I've found to make it work is change to a H5 and that does not produce acceptable results.

 

Can anyone suggest a method to get the two items to work together?

 

David

image1.doc

Link to comment
Share on other sites

There are several problems. By several, I mean many.

 

You didn't post your head section, what does that and your doctype look like?

 

Ideally, you should be using an external stylesheet so the style applies to every page of your site and if you have to change anything, you only have to do it once. The link to that external stylesheet belongs into that missing head section.

 

I assume there are an opening and closing body tag that just wasn't included in the code you posted?

 

align="center" is deprecated. Instead, use your external stylesheet and write

h2 { text-align: center;}

 

No need for strong - h tags are bold by default, so defining them as strong is pretty much redundant.

 

<br />

Is a line break tag - it is not meant to be used to create space. If you want more space between you h2 and what's next, use your external stylesheet to add

h2 { margin-bottom: 15px;}
(of course the number of pixels depends on the amount of space you want) 

 

Your navigation is a list and should be coded as such (with ul and li tags)

 

If you're floating somethign, you don't add line breaks - again, use the stylesheet to add margins or padding..

 

All your written detail should be inside paragraph tags (one paragraph at a time) - same goes for what's following your H3 Mission stuff.

 

You're also missing your div="main" closing tag, but maybe you just didn't copy/paste everything.

 

The above gives you this - view the source to see exactly what I did.

 

Now just add margins or padding.

 

Also, it'd be good to wrap everything between the body tags into a wrapper division and style that to

#wrapper { 
	margin:  0 auto; (to center things)
	width: 1020px; (or some other with)
}

 

To get your navigation list back into a line, see this: http://how-to-build-...h-html-and-css/

 

Let me know if you have any questions.

Link to comment
Share on other sites

  • 4 months later...

I should have said they print exactly as they appear on screen, i.e. the colors are flat. I will try the other formats you suggest and see if that makes the difference. thanks

 

I think you're in the wrong thread - but I looked at the other 2 you've posted in, and this doesn't seem to fit there, either. What did I miss?

Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

Loading...
×
×
  • Create New...