CSS help!

  Revi 09:30 23 Nov 05
Locked

Using CSS, I am trying to get a picture/image placed on the left side of the canvas (screen) and on the right hand side a text material. Whatever I am doing, either the picture is coming above or below the text and not side by side. I want the picture & the text to cover 80% width of the screen and 100% height. Would it be possible for any one to give me the exact coding for the HTML & the CSS pages to achieve the above result? Thanks.

  PurplePenny 11:38 23 Nov 05

This is covered in the W3Schools tutorial on CSS. There are some examples there too:

click here

  Revi 12:07 23 Nov 05

Haven't found my answer there, thanks anyway!

  PurplePenny 15:29 23 Nov 05

You do it using CSS float as in the first example on that page I linked to.

I assume that you don't want the text to flow under the image, as it does in that example, in which case you need to wrap both the text and the image in a <div> and then give CSS float properties to the image. Wrap the entire page in another div with the CSS property {width: 80%}.

There is an example of what I mean in the same tutorial. It is their 7th example "Creating a homepage without tables: Use float to create a homepage with a header, footer, left content and main content."

Here is a direct link to it:

click here

  djinn 19:18 23 Nov 05

Post a link to what you have so far - then someone will be able to help you better.

Cheers

  Revi 15:42 24 Nov 05

Sorry, I do not have the facility to post this link.

  PurplePenny 21:04 24 Nov 05

Everything you need to know is there in that "Creating a homepage without tables" example. If you don't want a header and a footer just miss out those divs.

I have just started on CSS and I purchased "Spring into HTML and CSS" isbn 0-13-185586-7", bought it via Amazon. It has all you need with example pages. Works great!

  Revi 13:22 26 Nov 05

Thanks!

  Revi 13:24 26 Nov 05

Thanks, does the book have examples similar to my requirement given above? Grateful for a speedy answer.

  djinn 17:46 26 Nov 05

I bought this a couple of weeks back - it's the biz.......

Bulletproof Web Design by Dan Cederholm.

This is a great book - probably requires some previous knowledge - but great for CSSP, and yes does cover roughly what you want to do.

You'll be positioning elements all over the place (and I mean that in the best possible way) after reading this.

HTH

Cheers

This thread is now locked and can not be replied to.

Amazon Fire HD 8 review: A brilliant combination of function and value – with one massive caveat

1995-2015: How technology has changed the world in 20 years

How to create an introvert-friendly workplace

Apple Watch 2 review | Apple Watch Series 2 review: New Apple Watch is faster, brighter, water-resit…