The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

> Positioning Elements, Dropping buttons on top of an image
post Sep 27 2006, 07:03 PM
Post #1

Group: Members
Posts: 2
Joined: 27-September 06
Member No.: 252

Im having difficulty teaching myself how to place buttons on top of an image im using for my homepage.

Ideally im trying to make 4 rollover buttons apprear in the lower right corner of my image, like so:


Ive been racking my brain for hours on this and I cannot accomplish my goal, to see what I have thus far:

This I have accomplished like so:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<link href="/public_html/styles.css" rel="stylesheet" type="text/css">

<div class="Monkeys">
  <div align="center">
    <img class=MonkeyPic src="/Logo4.jpg" alt="AngryMonkeyLove" >
      <img class=Buttons src="/Buttons/ForumA.gif" alt="Buttons" >


/* CSS Document */

.Monkeys {
background-color: white;    
height: 600px;
width: 800px;
.Buttons {
background-color: white;
float: left;

Optimally I want 4 buttons along the bottom right of the image, I have designed a pressed and an unpressed version.

Can anyone help me with this?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

Posts in this topic

Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:


- Lo-Fi Version Time is now: 20th October 2019 - 08:53 AM