HTML - Drop Shadows Over Gradient --> Is It Possible?

i want to be able to make a gradient left to right on my page background color, but am having no luck finding a reference page.

what attributes would i add to my CSS file?

thanks!


The FlyerFly

How to display gradient text effects without using image in html.

Hello - I'm currently in the early stages of putting together a new website, and I'm trying to have a top-bottom color gradient (in the "header" area of the page) with a background image (i.e. picture) as well. I can do each individually no problem (gradient with a 1px repeat-x image in css; and the image quite obvious), but I want to keep the gradient consistent across the entire top of the screen, regardless of the viewer's screen resolution, and the picture centered. Anyway to de-couple the two?

You can see the current one-big-image solution here (and I want to see the gradient continuing on forever):
http://tomatomountain.com/738/

I could just make the background image really wide, but it seems a waste of space and file size.

First Hi. I am new to this forum and quite newbie in HTML...I looked around the web, but info can be messy sometimes and I remain stucked...so here am I hoping I will solve this. Thanks to you in advance :-)
SO :
The problem is recurrent and simple :
I HAVE A PSD BACKGROUND THAT I WANT TO STRECH ALL ALONG MY HTML PAGE...BUT WHATEVER I DO IT DOES NOT WORK , it repeats but does not strech.
I am working with D8.
Somebody could guide on this ?

I have a gradient image I'm trying to use as a background for a <div>, but I'm having a bit of a problem in that I can't get the image to stretch properly to fit the <div>.

The thing is the </div> can change size, and the image needs to be able to change size with it. I've managed to get it working to the point where the image will TILE to fit the <div>, but that doesn't create the look I want. I need it to STRETCH, not tile.

I have also managed to get the image to stretch to the browser window, but like I already said, it needs to stretch to fit the <div> while ignoring the size of the browser window.

Just in case you have trouble visualizing exactly what I'm talking about, I have already uploaded two different versions of the partially finished website at the following URLs:

http://www.finalfreak.greatnow.com/neo_index.html
http://www.finalfreak.greatnow.com/neo_index2.html

Notice how in the second link the gradient continues past the footer to the bottom of the window? That's what I'm trying to fix. What I want is for the image to conform to the size of the <div> like in the first link, but without tiling like the first link.

Also, the page currently only works properly in Firefox. I'm planning on fixing it to work right with Internet Explorer as well, but I'd like to get the gradient problem resolved first.

I've been trying to get this to work for days now and it's driving me crazy! Any help would be greatly appreciated.

I am using a css gradient background in a header and footer <div> area that have a border radius set. The problem is that in IE9 the gradient background is squared off and extends past the border radius. Now in FF 4.0 this does not happen, it is only happening in IE9. Here is the coding for the area in css:
Code:

.footer {
    padding: 10px ;
    background:#000000;
    background: -webkit-gradient(linear, left top, left bottome, from(#000000), to(#666666));
    background: -moz-linear-gradient(top, #000000, #666666);
    -ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#000000, endColorstr=#666666)";
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#000000, endColorstr=#666666);
    border:2px solid #cccccc;
    border-radius:10px  10px  10px  10px;
    -moz-border-radius-bottomleft:10px;
    -moz-border-radius-bottomright:10px;
    -moz-border-radius-topleft:10px;
    -moz-border-radius-topright:10px;
    position: relative;
    clear: both;
}

I know that Firefox renders html pages more efficiently than IE, but unfortunately not everyone is as smart to use FF.

Hi,

How can I set a background gradient for a cell in a table? (i.e., start colour:#222222; end colour:#000000) The size of the cell may vary so a tiled image wouldn't work.

Thanks.

I am trying to make a form that submits info to Paypal. This is a drop box form that selects one of two things. Depending on the item selected, I want paypal to charge a different amount.

Here is code that I thought should work, but apparently I don't know the ins and outs of drop boxes. Could I get some help?

<select name="type of service" id="type of service">
<option selected>Select One...
<option> I will format the Pix myself
<input type="hidden" name="item_name_1" value="format myself">
<input type="hidden" name="amount_1" value="1.00">
</option>
<option> You can format the pix for me
<input type="hidden" name="item_name_2" value="you format">
<input type="hidden" name="amount_2" value="3.00">
</option>
</select>

Thanks!

I have two pages both have drop down. On the 1st page the user selects an option on the drop down, after the user choose an option it will go to the next page and I want the option showing on drop down on the 2nd page to be the option the user choose on the 1st page

example:
1st page option:blue,orange,red so when I pick orange on the 2nd page the drop down will have initial value of orange

I hope this is clear

I want a drop down with about 10 items. The 10th being "other", if people select "other" a text box appears and people can then write in what "other" means.

Any suggestions on the best code for this?

Here is the code I have so far:

HTML Code:

<form id="form1" name="form1" method="post" action="">
  <label>How did you hear about us?
  <select name="select">
    <option selected="selected">Please Select</option>
    <option>Search Engine</option>
    <option>Friends &amp;  Family</option>
    <option>Word of Mouth</option>
    <option>Newsletter</option>
    <option>TV</option>
    <option>Newspaper</option>
    <option>Magazine</option>
    <option>Blog</option>
    <option>Other</option>
  </select>
  </label>
</form>

Hi guys,

When you first launch Livestream's websites (http://www.livestream.com/), a drop down slides down from the top of the window which you can then close. Is this some sort of dynamic HTML?

Does anyone know where I can find a tutorial on this??

A

Greetings All -

I've been here before and plan on being around a lot more as I've bitten off a little bit more than I can chew with overhauling my school district's website. Thanks for all the help you offer!

I've got the page at http://joomla.ridgway.k12.co.us looking pretty good but for some reason the sub level navigation for About Us and Secondary disappear before I can get to a link. I believe this is a focus problem, but in my efforts I can't fix it. Can someone point me in the direction where I could fix this?

Thanks for your time.

Dear HTML Experts,

I need your help, I would love to have a dropdown menu.
Which drop out of a image? Like when your mouse is at the image, the menu shows up vertically?

Thanks

Hi,

I have finally managed to create the drop down that I want and placed the code into my page after testing. However I have a table of 24 teams, and only 9 of them are showing. I have tried to add <tr> breaks and show 4 across but the mouseover box then appears at the bottom of the table even when I mouseover at the top.

Ideallly I would like to place these links in the table I created here; http://www.freewebs.com/jonnibravo/l...forumsmain.htm

Here is the test page where my code exsists; http://www.freewebs.com/jonnibravo/testpage.htm sorrted