CSS alignment

toastyman

toastyman

toastyman

Associate
Joined
30 Dec 2005
Posts
415
Ok having a real pain of a problem, and I bet there's a really simple solution to this...

Basically, I've got a div which contains some images, and when you move the mouse over each one, it updates some text in another div. However, this div won't stay inline with the first one for some odd reason. I want the text div to go to the right of the images in the blue space provided...

http://www.ppdrmanagement.com/

I've outlined the two divs in question with black borders (on the right hand side), so you can see whats what.

If anyone has any ideas/fixes for this problem, i'd really appreciate a fast reply.

Cheers,

Rich
 
This is the section in question:

Code: 
<td colspan="2" class="horzheadsplit" style="background-image: url(/images/loginbg.gif); text-align:left">

<div style="position:relative; left:8px; top:1px; width:119px; display:inline; height:33px; border:solid 1px black">
<a href="" onmouseover="qtext('<p>Previous page</p>')" onMouseOut="qtext('<p>&nbsp;</p>')"><img src="/images/qmback.jpg" alt="Return to the last page you were viewing" style="width:39px; height:33px; border:none; vertical-align:middle"></a><a href="http://www.ppdrmanagement.com:2095" onMouseOver="qtext('<p>Check your email</p>')" onmouseout="qtext('<p>&nbsp;</p>')"><img src="/images/qmmail.jpg" alt="Check your email" style="width:43px; height:33px; border:none; vertical-align:middle"></a><a href="/sitemap/" onMouseOver="qtext('<p>View the sitemap</p>')" onMouseOut="qtext('<p>&nbsp;</p>')"><img src="/images/qmsearch.jpg" alt="View the Sitemap" style="width:37px; height:33px; border:none; vertical-align:middle"></a>
</div>
<div id="qmenu" style="display:inline; height:33px; width:20px; border:solid 1px black"><p>&nbsp;</p></div>

</td>

The div "qmenu" is the one which contains the text. You can see this at www.ppdrmanagement.com under the main menu on the right hand side.
 
I would convert the layout to divs, but the problem i'm having at the moment is a serious lack of time... also, I wouldn't be paid for the extra work.

Guess its down to a CSS hack
 
Ok i've read up on the box model hack, but i'm not seeing how its going to help. Here is the CSS of the two divs, all I want is for them to sit next to each other:

Code: 
#qmenub { position:relative; left:8px; top:1px; width:119px; display:inline; height:33px; border:solid 1px black;}
#qmenu p { display:inline; height:33px; width:20px; border:solid 1px black; font-family:Tahoma, Verdana, Arial, Helvetica, sans-serif; color:#FFFFFF; font-size:9px;}
 
Yay it finally works :D

Cheers Augmented, D4ve and Al Vallario.

I recently found out that XHTML 1.1 shouldn't be sent in text/html and only in xml/html so am going to change that back to 1.0. As for the tables, well I wouldn't get paid to put them into divs, as the company is seeing no difference in the design, so they wouldn't be willing to pay me for it.

I'll probably just wait for the next redesign of the site due in the summer.

Cheers all.
 
As soon as I get some free time (haven't actually had any for ages now!), I will redo the page into divs etc. Atm the company is still setting up, so i'm concentrating all my efforts on the backend of things...building a helpdesk, sorting out server moves to dual opteron machines, keeping clients happy etc :)

One day!
 
You must log in or register to reply here.
Back
Top Bottom