Forum Moderators: not2easy
I'm currently in the process of integrating an external style-sheet into a pre-existing website. Right now, the css is only controlling the main font size and color, because I'm going through and removing the previously-placed formatting tags very slowly (since it's such a tedious process).
The first thing I'm wondering is how to format the style-sheet so that I can color certain text differently than the rest of the text (blog dates, etc.). I've tried <P CLASS=(classname)>, but that causes the words in question to be on a separate line from the text after it. How can I keep the colored text on the same line as the black text (my main font color)?
Also, I'm currently using iframes, but as the site's an ezine, I want to convert to tables so that I can eventually have affiliate and ad banners on either side of the main contents. Is there a way that css can help me to do so, so that changing the affiliate buttons (for example) could be done through an external style-sheet? I was thinking there may (hopefully) be a way to add a style-sheet with tables to an html page with contents.
And lastly, how can I use css for placing images on my site? If anything, that may help me with the above question--but I'd also like to use it for my banner (which I need centered).
Thanks in advance for helping this css newbie out! :)
One thing about this place.. there are so many disciplines covered here that even heros of one forum are likely to be newbies to another. There are no dumb questions (well, not many at least) That said, I ain't no CSS guru either :)
But as far as your wanting to give a different colour to a word in a sentence, I use 'span' instead of 'div' in that instance. Works like a charm.
There's a lot of questions there, I would suggest looking over the library [webmasterworld.com...]
A conceptual point; CSS is concerned only with styling content and positioning elements. Structure is left to the html itself, eg...headers <h1>, paragraphs, <p> and tables too etc...
Tables can be styled with CSS but not constructed. Strictly speaking, tables should only be used for displaying tabular data like train time-tables for instance and not for layout purposes, hence CSS won't "build" your tables.
A quick pointer on styling inline text within a paragraph for instance, you can use a <span style="background-color: transparent; color: gold">TEXT</span>, which will style the word "TEXT" only.
Stick around, there's loads to be learn't and rest-assured that you are on the right track.
The first thing I'm wondering is how to format the style-sheet so that I can color certain text differently than the rest of the text (blog dates, etc.). I've tried <P CLASS=(classname)>, but that causes the words in question to be on a separate line from the text after it. How can I keep the colored text on the same line as the black text (my main font color)?
If you previously worked with html, this behavior shouldn't surprise you. <p> is a paragraph tag, no matter if there is CSS attached to it or not.
What your are looking for might be the span-tag (like TheWhippinpost suggested), although using styles *inline* (that is <sometag STYLE="somestyle">) is considered not good style.
Emphasizing dates I would suggest using the regular emphasizing html-tags <em> or <strong> ("Hey guys, its <em>Sunday, June 15th</em> - Good morning"). In your stylesheet you can attach any format to these tags that you wish, e.g.:
em { font-size: 5em; color:#ff0000; border: 1px solid #ff0000; } <- bigger font, other color, some border around it
And lastly, how can I use css for placing images on my site? If anything, that may help me with the above question--but I'd also like to use it for my banner (which I need centered).
The <img> tag still exists :-) and you can also adjust it's parameters in CSS...
img { border: 2px solid #0000ff; }
Furthermore all CSS styles have the attribute background-image which can be seen as the css equivalent for the html 3.2 - <table background=""> or <body background="">
lots of stuff to play around with, have fun :-)
Tables can be styled with CSS but not constructed. Strictly speaking, tables should only be used for displaying tabular data like train time-tables for instance and not for layout purposes, hence CSS won't "build" your tables.
See Section 17 - Tables [w3.org] of CSS2
.table { display: table }
.row { display: table-row }
.cell { display: table-cell }
<div class="table">
<div class="row"><span class="cell">one</span><span class="cell">two</span></div>
<div class="row"><span class="cell">three</span><span class="cell">four</span></div>
</div>
I came back yesterday and sent a reply, but it appears to not have gone through.
Thanks for your suggestions! I used the <em> tag with some tweaked attributes and got the effect I wanted. As for tables, a friend of mine suggested using small iframes instead (not sure why I didn't think of this), as they can be laid out on every layer of the site for a look of continuity, yet be updated by changing just the one page--basically, they've taken the place of SSIs (yet another thing I failed to think of ... I need more sleep!).
Anyway, thanks again for the help! And btw, waldemar, I'm very familiar with html, but I wanted to emphasize why I didn't want to use the <p> tags when it would have otherwise been an obvious suggestion. :)
