little problem :)

@ulthaneApr 30.2010

Hello,
i wanted to ask for help regarding the website im building
1)how to put an image on another image? for example i got an image of a bar for buttons, and the 2nd image is the button itself- i wanna put the button on the bar and it doesnt let me do so
2) i wanted to ask how do i develop a button so when i mouse-over it, it will open a menu list of a few more buttons to different links

if that matters, i work with ASPX pages atm
im a beginner with web developing
Thanks for the help ?

to post a comment

Full-stack Developer

49 Comments(s) _↴

@tirnaApr 30.2010 — #1) You could use the bar image as the background image for the element containing the button images.

2) You could use css :hover or onmouseover, onmouseout.

@cfajohnsonApr 30.2010 — #[indent]

Do the buttons contain text? If so, use text, not images.

[/indent]

@ulthaneauthorMay 01.2010 — #1) You could use the bar image as the background image for the element containing the button images.

2) You could use css :hover or onmouseover, onmouseout.[/QUOTE]

Thanks, i've done the Drop down menu i wanted ?

but i still cannot find out how to put the images on the bar, doesnt seem to let me, if u can give me any code or something i could use to do so i would appreciate that ?

Do the buttons contain text? If so, use text, not images.[/quote]
yes they contain text, but i designed those buttons in photoshop specially for the website, i dont want to use just a text... ?

@ulthaneauthorMay 01.2010 — #Well i got my problems solved, thanks for the support guys ?

But now i need help with another thing, when ever i put a button that works as a link or just text with link to another site, it has that blue/purple thingy around it, how to make it dissapear? its pretty annoying ? example:

[upl-file uuid=6245bd0f-2aa3-402f-9b2e-069751fde2b4 size=4kB]untitled.JPG[/upl-file]

@criterion9May 01.2010 — #

[code=html]
 <a href="your_href"><img src="your_image.img" border="0" /></a>
 [/code]

@ulthaneauthorMay 01.2010 — #Thanks criterion9, worked ?

Now there's another thing i wanna check, for some reason i cant pull images close to the borders of the page, for example the header, i dont want spaces between the edges of the page, can some1 tell me how to solve it?

Example:

[upl-file uuid=01450d03-151b-4700-8beb-eb1a7f44bff3 size=37kB]untitled.JPG[/upl-file]

@criterion9May 01.2010 — #Check the margin and padding for the body and subsequent container elements.

@ulthaneauthorMay 01.2010 — #hmm can u give an code example please? i didnt really understand what i need to do with those padding / margin thingies, never used them before

@criterion9May 01.2010 — #http://www.w3schools.com/css/default.asp

http://www.tizag.com/cssT/

http://www.w3schools.com/css/css_padding.asp

http://www.w3schools.com/css/css_margin.asp

@cfajohnsonMay 01.2010 — #

[code=html]
 <a href="your_href"><img src="your_image.img" border="0" /></a>
 [/code]

[/QUOTE]
[indent]

That is invalid XHTML.

The IMG tag requires an ALT attribute.

[/indent]

@cfajohnsonMay 01.2010 — #Thanks criterion9, worked ?

Now there's another thing i wanna check, for some reason i cant pull images close to the borders of the page, for example the header, i dont want spaces between the edges of the page, can some1 tell me how to solve it?
[/QUOTE]
[indent]

<i>
 </i>body
 {
 margin: 0;
 padding: 0;
 }

[/indent]

@criterion9May 01.2010 — #[indent]

That is invalid XHTML.

The IMG tag requires an ALT attribute.

[/indent][/QUOTE]

Oops. Was typing on my mobile. Apologies.

@ulthaneauthorMay 01.2010 — #still doesnt seem to do anything for me, i've tried the way u said putting it between the <body></body> elements and it did nothing

Tried to follow the guide to put it between <style="text/css"></style> also didnt work, so i probably understand it wrong...?

@cfajohnsonMay 01.2010 — #still doesnt seem to do anything for me, i've tried the way u said putting it between the <body></body> elements and it did nothing

Tried to follow the guide to put it between <style="text/css"></style> also didnt work, so i probably understand it wrong...?[/QUOTE]
[indent]

STYLE elements must be in the HEAD, not the BODY.

Ot use a style attribute:

<i>
 </i>&lt;body style="margin:0; padding:0; "&gt;

[/indent]

@Jarrod1937May 01.2010 — #You can make the button design be an image and use text for the actual button text, since you're not using a fancy font or anything. Otherwise your buttons will not be good for individuals with accessibility problems and is more inefficient since you have to load a unique image for each button rather than a single image (or two images for an expanding design) for all.

@Jarrod1937May 01.2010 — #[indent]

STYLE elements must be in the HEAD, not the BODY.

[/indent][/QUOTE]
Any source on that? I know its bad practice to place them in the body, but thought it was still valid.

@ulthaneauthorMay 01.2010 — #[indent]

<i>
 </i>body
 {
 margin: 0;
 padding: 0;
 }

[/indent][/QUOTE]

You said it ?, besides i wrote that Style thingie in the head, didnt work anyways...

@Jarrod1937May 01.2010 — #You said it ?, besides i wrote that Style thingie in the head, didnt work anyways...[/QUOTE]
That quote is simply saying that this css style info pertains to the tag referred to as "body", don't confuse it with saying that it should be applied directly to the body. You basically should do this (although out of good practice you should include a unit for the margin and padding):

[code=php]<head>
 <style type="text/css">
 body
 {
 margin: 0px;
 padding: 0px;
 }
 </style>
 </head>
 [/code]

However, you will only notice a difference if that is your problem, it was simply a suggestion to try.

@cfajohnsonMay 01.2010 — #Any source on that? I know its bad practice to place them in the body, but thought it was still valid.[/QUOTE]
[indent]http://www.w3.org/TR/html4/present/styles.html#edef-STYLE

"The STYLE element allows authors to put style sheet rules in the head of the document. HTML permits any number of STYLE elements in the HEAD section of a document."

[/indent]

@ulthaneauthorMay 01.2010 — #That quote is simply saying that this css style info pertains to the tag referred to as "body", don't confuse it with saying that it should be applied directly to the body. You basically should do this (although out of good practice you should include a unit for the margin and padding):

[code=php]<head>
 <style type="text/css">
 body
 {
 margin: 0px;
 padding: 0px;
 }
 </style>
 </head>
 [/code]

However, you will only notice a difference if that is your problem, it was simply a suggestion to try.[/QUOTE]

Worked! thanks ? , now gotta adjust texts and images alittle cuz its pretty much messed up

@cfajohnsonMay 01.2010 — #(although out of good practice you should include a unit for the margin and padding):

&lt;head&gt;
 &lt;style type="text/css"&gt;
 body
 {
 margin: 0px;
 padding: 0px;
 }
 &lt;/style&gt;
 &lt;/head&gt;

[/QUOTE]
[indent]

There is no reason to use units with 0; 0px is the same as 0em or 0miles.

[/indent]

@Jarrod1937May 01.2010 — #[indent]http://www.w3.org/TR/html4/present/styles.html#edef-STYLE

"The STYLE element allows authors to put style sheet rules in the head of the document. HTML permits any number of STYLE elements in the HEAD section of a document."

[/indent][/QUOTE]
They say it is only allowed in the head section in a very roundabout way, but that is good enough for me, thanks ?

@ulthaneauthorMay 01.2010 — #btw, i didnt get an answer earlier to the text part... still need to know how to do that, thanks ?

But now i need help with another thing, when ever i put a button that works as a link or just text with link to another site, it has that blue/purple thingy around it, how to make it dissapear? its pretty annoying ? example:[/QUOTE]

@cfajohnsonMay 01.2010 — #
But now i need help with another thing, when ever i put a button that works as a link or just text with link to another site, it has that blue/purple thingy around it, how to make it dissapear? its pretty annoying ? example:[/QUOTE]
[indent]

<i>
 </i>border: none;

Or:

<i>
 </i>border: 0;

[/indent]

@ulthaneauthorMay 01.2010 — #for text? does nothing...

@cfajohnsonMay 01.2010 — #for text? does nothing...[/QUOTE]
[indent]

Text links don't have a border, so of course it's not going to do anything.

[/indent]

@ulthaneauthorMay 01.2010 — #So how do i make them stay at their original colour (for example white) ?

atm they appear as a link colour (purple/blue)...

@cfajohnsonMay 01.2010 — #So how do i make them stay at their original colour (for example white) ?

atm they appear as a link colour (purple/blue)...[/QUOTE]
[indent]

<i>
 </i>a { color: white; }
 a:visited { color: #eee; }
 a:hover { color: red; }

[/indent]

@ulthaneauthorMay 01.2010 — #hehe nice, thanks ?, is there a way to delete the underline?

@cfajohnsonMay 01.2010 — #hehe nice, thanks ?, is there a way to delete the underline?[/QUOTE]
[indent]

http://www.w3.org/TR/CSS21/propidx.html

[/indent]

@ulthaneauthorMay 02.2010 — #Thanks for the guides and the support guys ?

i've read them and now my homepage is done ?

Thanks alot

@ulthaneauthorMay 02.2010 — #Hello again,

my little site is finally completed ? now im looking around for some add ons, i've saw that some websites got nice effects, like when u mouseover an object it glows etc

wanted to ask how to do it? can any1 give me any guides? thanks ?

@Declan1991May 02.2010 — #:hover when you hover, :link for links, :active for links that are being clicked, :visited for visited links etc. They are called pseudo-classes.

@ulthaneauthorMay 03.2010 — #:hover when you hover, :link for links, :active for links that are being clicked, :visited for visited links etc. They are called pseudo-classes.[/QUOTE]

i know that, i meant how do u make the effects its self? in another program like photoshop? and how etc...

for example i want my buttons to have some glowing aura around them when they are being targeted.

Other thing, i tried to run my website from another browser and it was completely messed up, so i belive the only browser that runs my site properly is the old version of IE, any other browser doesnt seems to load the website so good (texts and graphics are messed up)....can any1 tell me how to solve it?

Thanks

@cfajohnsonMay 03.2010 — #i know that, i meant how do u make the effects its self? in another program like photoshop? and how etc...

for example i want my buttons to have some glowing aura around them when they are being targeted.
[/QUOTE]
[indent]

This will work in browsers that support the CSS3 property, text-shadow: http://cfajohnson.com/testing/css.shtml

[/indent]

Other thing, i tried to run my website from another browser and it was completely messed up, so i belive the only browser that runs my site properly is the old version of IE, any other browser doesnt seems to load the website so good (texts and graphics are messed up)....can any1 tell me how to solve it?
[/QUOTE]
[indent]

Not without seeing the page. Please post a URL.

[/indent]

@ulthaneauthorMay 03.2010 — #This will work in browsers that support the CSS3 property, text-shadow: http://cfajohnson.com/testing/css.shtml
[/QUOTE]
i guess my doesnt support it ? cant see the effects

Not without seeing the page. Please post a URL.[/QUOTE]

my site is not public or something, its only on my PC atm, tell me what excactly do u want to see?

@cfajohnsonMay 03.2010 — #
my site is not public or something, its only on my PC atm, tell me what excactly do u want to see?[/QUOTE]
[indent]

Then put it on the web so that we can see what you are talking about.

[/indent]

@ulthaneauthorMay 03.2010 — #This is how it looks like in IE:

http://tinypic.com/view.php?pic=5d4awn&s=5

And this is how it looks like in firefox for example:

http://tinypic.com/view.php?pic=6elllg&s=5

@Declan1991May 03.2010 — #It depends on how you are forming your buttons. Are the images? If so, use an image editing program.

You have cross-browser problems. If you designed with an old version of IE in mind, you will find it extremely difficult to fix it. You would be better off designing in Firefox or Opera, and then adding a fix or two for IE if necessary. We can't possibly help more without sample HTML and CSS.

@ulthaneauthorMay 04.2010 — #Hello again,

i wanted to ask how to solve the next problem:

when i watch my site on a full screen mode it runs perfectly, but when i watch on smaller window all the objects in the site moves aswell and causing a mess up, any solution on that?

another thing is that i started fixing my site for different browsers, so for google chrome i had space in the bottom of the page and had to resize my background image, now for firefox i got blank space on the right side of the screen.......how to solve those annoying things? >_<

Example:

[upl-file uuid=fb95e15a-c394-45b7-b60d-6654a64548d1 size=100kB]untitled.JPG[/upl-file]

@cfajohnsonMay 04.2010 — #how to solve those annoying things?[/QUOTE]
[indent]

The first step is providing the HTML and CSS so that we can see what's going on. Preferably, post a URL.

Before you do that, however, validate your HTML (http://validator.w3.org/) and correct any errors.

[/indent]

@CharlesMay 04.2010 — #They say it is only allowed in the head section in a very roundabout way, but that is good enough for me, thanks ?[/QUOTE][i]From the 4.01 DTD:[/i]
<!ENTITY % head.misc "SCRIPT|STYLE|META|LINK|OBJECT" -- repeatable head elements -->

<!ENTITY % head.content "TITLE & BASE?">

<!ELEMENT HEAD O O (%head.content? +(%head.misc? -- document head -->[/quote]That means that the HEAD element can contain one or more STYLE elements.
<!ENTITY % block

"P | %heading; | %list; | %preformatted; | DL | DIV | NOSCRIPT |

BLOCKQUOTE | FORM | HR | TABLE | FIELDSET | ADDRESS">

<!ELEMENT BODY O O (%block;|SCRIPT)+ +(INS|DEL) -- document body -->[/quote]Means that the BODY cannot contain STYLE elements. However, those also mean that the start and end tags for the BODY and HEAD elements are optional. If you omit them then if your STYLE is the first thing in your BODY then the browser will think that it's the last thing in the HEAD and all will be well.

@Jarrod1937May 04.2010 — #[i]From the 4.01 DTD:[/i]That means that the HEAD element can contain one or more STYLE elements.Means that the BODY cannot contain STYLE elements. However, those also mean that the start and end tags for the BODY and HEAD elements are optional. If you omit them then if your STYLE is the first thing in your BODY then the browser will think that it's the last thing in the HEAD and all will be well.[/QUOTE]
Oh ok, thanks for the more in depth explanation, i guess there is no better source than the actual dtd itself.

@ulthaneauthorMay 24.2010 — #hello again every1,

in continueing of my school project i need to make a registration page, so i made the page, and the ASP page which checks it and then sends the info to the DB (i made DB with access since i haven't learned any other way yet)

however, when it gets to the sending of the info part, it throws an error i dont know how to solve, here are screens, hope to get helped, thanks in advance ?

[upl-file uuid=e91cef04-5e4c-4272-9f15-d64694e50c81 size=70kB]untitled.JPG[/upl-file]

[upl-file uuid=47824614-a1d7-476f-a8b4-e1edeeee34e7 size=53kB]untitled1.JPG[/upl-file]

@wiriFeb 03.2019 — #https://www.w3schools.com/css/default.asp

The !important directive affects the way in which your CSS cascades while following the rules you feel are most crucial and should be applied. A rule that has the !important directive is always applied no matter where that rule appears in the CSS document

@someshralettaFeb 05.2019 — #thank you for sharing i really liked it

for more information about lion tattos

visit us

[url=https://www.merrchant.com/daily/signs-of-genius/]signs of genius[/url]

[url=https://www.merrchant.com/blog/lion-tattoo/]lion tattoo[/url]

@shadewFeb 06.2019 — #@cfajohnson#1085545 Quick question. Is this invalid for HTML5 or just XHTML? As far as I know the alt attribute is optional for content. I believe I read somewhere that it is only required when the image content is required to understand the page it is on. If an image is a link, wouldn't the link href be enough to understand what the image is doing?

@NogDogFeb 06.2019 — #Generally speaking, it's not a great idea to re-open a 9+ year old thread.

[upl-image-preview url=https://www.webdeveloper.com/forum/assets/files/2019-02-06/1549427011-95025-screen-shot-2019-02-05-at-112231-pm.png]

I'll be locking this thread. If you have a question that needs answering now, I'd suggest opening up a new thread -- one that can give you a 2019 solution as opposed to a 2009 solution. ?

@NogDogFeb 06.2019 — #{"locked":true}

Also in #Full-stackDeveloper _↴

Apache conf file bug?Can you search across two different databeses?Help!!

Success!

Help @ulthane spread the word by sharing this article on Twitter...

Tweet This

little problem :)

49 Comments(s) _↴

Also in #Full-stackDeveloper _↴

Success!

Social

Version

little problem :)

49 Comments(s) ↴

Also in #Full-stackDeveloper ↴

Success!

The web is an endless sea of information. Don't miss the boat... Subscribe!

Social

Version

49 Comments(s) _↴

Also in #Full-stackDeveloper _↴