Jump to content

F-Man

Members
  • Posts

    222
  • Joined

  • Last visited

Everything posted by F-Man

  1. Try placing all your pictures on the same page, and using Javascript, give them a display of 'none', except the first one. document.getElementById('idOfSecondImage').style.display = 'none';document.getElementById('idOfThirdImage').style.display = 'none';etc It is important to you use Javascript and not CSS for this because that way users without Javascript will be able to see all your pics anyway.Then make it so that when you click on the "next" link it makes the first pic disappear, and the next appear. <a href="#idOfSecondImage" onclick="return next('idOfFirstImage','idOfSecondImage')" onkeypress="return next('idOfFirstImage','idOfSecondImage')">Next</a> Javascipt: next(1,2) { document.getElementById(1).style.display = 'none'; document.getElementById(2).style.display = 'block'; return false;} (take a look at the DHTML tutorials for more info)You will also need to change the values of 'href', 'onclick' and 'onkeypress' when calling the function, so that idOfFirstImage becomes idOfSecondImage, idOfSecondImage becomes idOfThirdImage, etc.I am not sure if you fully understood everything, it's quite complicated. =/ But that's a way to make it so that all your pictures starts loading in the same page, and therefore when you click to see the next picture, it appears right way.
  2. F-Man

    Help!

    I'd rather recommend the above suggestions, but if you don't think you're up to it, here's another one:Use absolute positionning to place your text where you want.<div style="position: absolute; top: XXpx; left: XXpx;">Text</div>(replace XX with a number of pixels)I usually would never recommend the use of the "style" attribute, but this looks like a desperate case.
  3. No, they usually update the table every month.Arakrys, you can go to http://www.onestat.com/html/aboutus_pressbox.html for more accurate stats (the ones at w3schools are more technical people so less IE, more Firefox than there actually is).
  4. To give widths to the cols, do this: .col1 { width: xx% }.col2 { width: xx% }etc (replace the xx with a real number of your choice) The attributes I was talking about are these: <table class="tut" width="70%" cellspacing="1" cellpadding="4">you should use an ID on your table like this:<table id="tut">And then use CSS for the rest: #tut{ border: 1px solid #496C87; border-spacing: 1px; width: 70%;}#tut td{ border: 1px solid #949CA5; padding: 4px;}
  5. Yes, there is a better way to do it.For the cell widths, use the <col /> element and give widths to that instead. <table id="tut"> <colgroup> <col class="col1" /> <col class="col2" /> <col class="col3" /> <col class="col4" /> </colgroup>... For the different text color, just write something like: .celltitle { color: black; font-weight: bolder;}...<span class="celltitle">Name:</span> Patterns Also, instead of the attributes you have, you should use the following CSS properties for the table's presentation: "width", "border-spacing" and on its cells: "padding". Remember that you should always try to separate content from presentation using CSS the most possible. border-spacing doesn't work on IE but you're obviously not aiming for IE support since your page is application/xhtml+xml.
  6. F-Man

    Gaps in Tables

    Yes there is. The best way to do it (and definitely the one you should use) is to simply remove the body's top margin. Or all body margins. Yes, CSS is the only "standard" way, as the rest is just propriety markup. body { margin-top: 0; /* or margin: 0; for all margins */} I just understood the topic at hand, so that's why I didn't answer this sooner, sorry.
  7. F-Man

    Gaps in Tables

    position:absolute; top:0px; left:256px... All CSS properties plus values, inside a style attribute. =P
  8. Floating is better. Using the display property is if you want your elements to become a table, so it's not for creating a layout.
  9. F-Man

    id & name

    In forms, name is used to send the data (in the form of "name=value"), you don't usually enter a name for a submit input because the user cannot change its value.
  10. Actually, you do it the right way Elmacik.Now all you have to do is to convert the font you want to an EOT file (with Microsoft Weft), upload it to your site and point to its URL instead of http://site/fonts/rob-celt. Though you should know that only IE supports embedding EOT fonts, and that the font-face at-rule has been removed in CSS 2.1 (doesn't mean it's unusable though).EDIT: Your Document Type Declaration has its URL mssing. Should be<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
  11. language="JavaScript" is wrong. The rest is mainly scripting errors.But you really should try to learn this stuff by yourself.
  12. CSS -> border-collapse: collapse;
  13. F-Man

    Header formatting

    Why negative margins???If your header is immidiately followed by an element with no margin, the element will overlap on the header.The best way is to simply remove margins (though I'd personnally keep some, but not necessarily too much). h1, h2, h3, h4, h5, h6 { margin: 0;}
  14. Nope, but you can simply set a minimum height to your divs so that the floated images stay inside them. <style type="text/css">.Article{ min-height: 100px; margin: 1em 0em 1em 0em; background: #eeeeee;}</style><!--[if lte IE 6]><style type="text/css">.Article { height: 100px;}</style><![endif]--> Unfortunately, IE doesn't support min-height, but treats height the same. so that's why I included a conditional comment.
  15. Hm, those are not animations, though those are. Thanks for the link. =)Though I'd really like to find tutorials, so if anyone knows any, please post. thanks.
  16. Hm, that's weird.I noticed there was something I forgot in my code: give the #content div a width of 100%. Though I don't see how that is causing problems with graphics being chopped... You're putting everything inside the #content div right?
  17. While I also agree that <font> should not be used, I'll answer your question anyway, because I know you could have placed any inline element, like <span>, but just decided to go with <font>.Normally, to validate, you'd need to close any inline element (span, font) inside a block element (p, div) before you close the block element like in your first example, even though browsers may render it the way you want by using the second example.
  18. F-Man

    CSS with <td>

    word-wrap: break-word? More like white-space: nowrap if you want it to not wrap. If you want it to wrap, use white-space: normal or just nothing at all, since it's the default.As for the width, you can do it on a single td, though I'd be more tempted to do it on the whole column.<table><colgroup><col /><col class="main"><col /></colgroup><tr><td>C1</td><td>C2</td><td>C3</td></tr><tr><td>C1</td><td>C2</td><td>C3</td></tr><tr><td>C1</td><td>C2</td><td>C3</td></tr></table>Then give a width to "main".
  19. I believe background-images do not stretch, not until CSS3 anyway.Here, try this:CSS: html, body { background-color: white; height: 100%; margin: 0;}#half2 { background-color: red; position: absolute; left: 50%; width: 50%; height: 100%;}#content { position: absolute;} HTML: <body> <div id="half2"></div> <div id="content"> Place content here </div></body>
  20. Instead of using &nbps;, you should use CSS word-spacing property.If your words are items in a list, use a <ul> and with CSS, make it "list-style-type: none" and the <li>s inside that list "display: inline" and use margins to separate them.
  21. Anybody know of some good tutorials for animating SVG but only with scripts? I want to see what I can do while keeping Firefox 1.5 support. =P
  22. Well they do take 100% of the window size. Why they do that instead of 100% of the div is because they're floated. Maybe a CSS way to make it work would be to make them inline (display: inline) but that might make it impossible to give them any height.Also, XHTML 1.1 is XML only. Use XHTML 1.0.
  23. F-Man

    Background Reapeats

    background-repeat: repeat-y;background-position: right;orbackground: url() repeat-y scroll right;
  24. F-Man

    one question

    This topis was better off as a Javascript question. =)
  25. Firefox is standards compliant and doesn't support all of Microsoft's priority code.
×
×
  • Create New...