Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

  • Congratulations biv343 on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

CSS style question

Status
Not open for further replies.

rrmcguire

Programmer
Oct 13, 2010
304
US
Have a couple quick questions....I have a CSS rule splash which contains a background image which won't be the same as my other pages. Problem being if I use this CSS rule on my other pages of course the background image follows with it as I have an external style sheet "allpages.css" which import these

So, with images is there an easier way of placing them rather than as a background image

ex.
 
If you need to reuse the element splash on other pages (which I can't imagine why you would need to), you could add an id to the body of each page (name it #front, #news, #products, or whatever, depending what is on the page). Then you would add a CSS rule to load a different (or no) background image to splash element on different pages.

You can, of course, always add an image as an img tag in the page, if you need it. You can find quite a few discussions on whether using images as tags or CSS backgrounds is more appropriate. Here is a nice consolidated reference:
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]
 
so if I chose to use an img tag rather than the background image how would I align it so that it would be aligned correctly for all browsers, whereas now with them as background images its done for me.
 
would you suggest If Im using img tags to use tables for the alignment. As shown here:


Also, if I use img tags, for my CSS rules that I had for the text on top of the bird image, how do I incorporate those within a table?

thanks for all your help
 
basically for the area where the two yellow bars meet, Im trying to put in text but which needs to formatted differently, so I thought I could use my CSS rules for this as shown below:

<table width="899" border="0" cellpadding="0">
<tr>
<td><img src="images/gettycropped3.png" /></td><h1>A FRESH NEW LOOK AT TRANSPORTATION</h1>
</tr>
</table>

but this isn't working, basically I wanted to get the same effect as I was doing at using my splash CSS rules with a background image, but using img tags and align the text on top of the image.
 
I believe that in your case, the best solution is then the background image. Please note that it is pretty much never a good idea to align images with tables. Especially when you only have one cell.

As I mentioned above, if you need to reuse #splash across different pages, give each page id in the body and then provide only common styling to #splash and add specific images to #pagename #splash.

[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]
 
yes, this is what Im ending up doing...thanks again
 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top