If this is your first visit, be sure to
check out the FAQ by clicking the
link above. You may have to register
before you can post: click the register link above to proceed. To start viewing messages,
select the forum that you want to visit from the selection below.

Class project help?

Just keep in mind this is an entry level class and not one that has to make a website that is going to change the world. I want my header to have three images spread across the top in the header box. I have the three images but the problem is they are not split up across the top. I have tried everything I can think of that I have gone over in the class. The <div> tag seems to make it look the best so far and keep them on the same row. The other problem when the browser is fully open they are all on one row. Make the browser smaller then they all move instead of adjusting to the screen size. The code is below: I use Aptana to do the code

I have updated the code and it works better but every now and then if the screen size is minimized smaller the right picture will overlap the middle if you stretch out the screen it fixes any clue on what is causing this issue?
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

I'll start with some of the less related changes. Structure-wise, it's always better to place javascript at the bottom of a page as it allows the page to load faster. Next, I removed your changeImage() function as I feel it wasn't needed (and I also believe it was causing your problem). Anytime you want to alter the appearance of anything on your page you should be using CSS. On a similar note your rotation function isn't needed. You can use CSS animations to create the same effect: https://developer.mozilla.org/en-US/...CSS_animations

I'll leave the CSS animations to you though. Next, you were close on what you were trying to achieve by setting the float and width of each element at the top of your page. I set the <html> and <body> elements to fill the screen (width and height) as removed any padding/margins added by browsers so that when applying widths that total 100% they actually had the full 100% of the screen to fill (by default the <body> has a margin which can prevent you from using 100% widths without going over).

Lastly there were some slight structure changes I made to simplify things. You can refer to the CSS to see how I applied the styling for each sub-element in your #header rather than coding it directly into the style attribute. The <img> elements needed to have a width of 100% so they would properly scale with their containing <div>.

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

Thanks So much for what you have told me and for the link on the CSS animation. I think I learn more from others than all the books I have ever read in class. The next part of the page I am going to put a slogan and was thinking to just create it in Photoshop and then just ad to the website through an image tag. Is that the best way or do you suggest just text and use CSS to make it look how I want?

Whether you use actual images or CSS for certain things on a page really depends on what you want the end result to be. CSS is capable of giving you a wide range of styles and effects, however you also have to consider browser compatibility. For instance, IE7/8 lack many newer CSS implementations. Images will look the same in any browser while CSS can sometimes differ. The other thing to take into consideration is complexity. If you are just applying some relatively basic effects to text then CSS is probably the option I would go with. CSS is all about appearance, but it's not a fully-fledged effects suite.

tl;dr More than likely you should be good to just use CSS for a slogan line.

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

I still have a lot to work on (nav,footer, and other pages) This will be the format and header for all pages. So once I have this ready I think everything else will be pretty easy "I hope". On the header the Taco Time logos are working and look great except the spacing across the header is not even I have tried all the different floats, and position things I have seen in the books. It will not let me attach my image on this site but the size is 100px X 100px circle logo on left that rotates, and then Cancuns Tacos 40px the another circle logo on right, then address on far right. There is at least 300px gap from logo one to name then only about 20px then next circle logo then 300px gap till address. When I try to change anything it sends things down below. Thanks for all the advice.

Your spacing issues would be due to how you have the top area setup now. 3 <div> tags filling 24.9% of the page's width each. Your images (and logo text) do not actually fill up the entire width of the <div>, however the <div> still is set to take up that much space (thus giving you the extra spacing between the actual image and the text). And easy fix should just be to remove the width from the #header div part of the CSS, allowing each of these divs to take up only the space they need. However you probably want to make sure none of the <div> tags take up too much space in the event the browser window is small, so you'd want to add a max-width value in your CSS.

And after explaining the what and why of those little things, in all honesty you are just going to add 'max-' in front of the width line in your #header div CSS.

Code:

#header div {
float: left;
max-width: 24.9%;
}

"Given billions of tries, could a spilled bottle of ink ever fall into the words of Shakespeare?"

My project is almost done I am on my last page and it looks pretty good for my first website. I am working on a ordering system and it looks fine and works but it adds too many decimal places for what the person would see ie: $21.95327 instead of just $21.95 the code is belowe I have tried using the to.fixed(2) but I either am not putting it in the right place or do not know how to use it. I had read about that code in a "Headfirst guide to JavaScript" any advice?

No, I wasn't giving you exact code to copy and paste. In your post you said you tried to.fixed(2), which is incorrect. The correct usage is .toFixed(2). In the context of your code you should be using something like this