Please look at this. I have it mostly done, but can't seem to get the images that are on the bottom up and to the right of the text.
CSS
------
www.webcoat.com/working/css/main_page.css
Thanks,
Michael
Please help.
can someone help me with this?
New to CSS
Try changing your css to:
#catalog { float: left; width: WHATEVER WIDTH OF THE IMAGE WITHIN IN PIXELS; } #footer { float: left; color: #000000; font-weight: bold; font-size: .6em; text-align: center; }
New to CSS
no good, all it did was move the whole thing left in IE and didn't do anything in mozilla. (which more often than not is the right way)
Thanks though.
New to CSS
The code could be tidied up a bit... you've closed the 'bottom' div before the footer starts, so the footer could never sit next to the image.
Here's the amended HTML you need to replace:
<div id="bottom"> <div id="menu"><img src="images/menu.gif" alt="menu to choose where to go"></div> <div id="text"><img src="images/text.gif" alt="text describing what we do"></div> <div id="new"><img src="images/new.gif" alt="new product link"></div> <div id="catalog"><a href="catalog"><img src="images/frontcat.jpg" alt="picture of, and link to catalog"></a></div> <div id="footer">Copyright 2004 Visions Innovated Products, Inc. For Website Comments please email <a href="mailto:[email protected]">Webmaster</a></div> </div> </div> </body> </html>
And the correct CSS... amend to the style you require:
div#catalog { float: left; width: 150px; } div#footer { float: left; color: #000; width: 400px; margin: 8em 0 0 1em; font-weight: bold; font-size: .6em; text-align: left; }
New to CSS
what do i do with the new {} that is in between the catalog and the footer?
that image needs to be on top of the catalog and both right of the text and the footer under that...
I appreciate the help.
New to CSS
I didn't include the new { } because there was nothing in it. If it's going to contain something, then you'd have to insert the HTML and CSS so we can see what you are trying to achieve.
New to CSS
it is in the html the line you pasted: <div id="new"><img src="images/new.gif" alt="new product link"></div>
I just don't have anything in the css code yet cause I don't know what to put there yet...
I need the image new.gif and frontcat.jpg to be on the right of the text in the middle and the footer to be under it all...
THanks
New to CSS
Okay... replace the following CSS:
#menu { float: left; width: 150px; } #text { float: left; width: 370px; } div#catalog { float: left; width: 150px; margin: 1em 0; } #new { float: left; width: 150px; } div#footer { clear: left; color: #000; width: 400px; margin: 8em auto 0 auto; font-weight: bold; font-size: .6em; text-align: left; }
New to CSS
Wow! Perfect. So, basically in the future if I wan to line things up like that just float them all left and make sure to put thier widths?
I really appreciate the help.