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!

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

Elements moving on the page

Status
Not open for further replies.
HMKS

HMKS

MIS
Feb 25, 2008
6
US
GREETINGS ALL, I have a webpage I'm working on where I have some images and text absolutely positioned on the page. When the screen is maximized it looks find but when the browser is minimized partially the images and text move. Is there any way I can prevent this from happening.
 
Sort by date Sort by votes
The code should be irrelevant here is an example When the page is minimized and the window is dragged from right to left or vica versa the text moves on the next line and etc. I want elements to stay put when the window is minimized here is something I just wrote to demonstrate.

Code: 
<html>
<title>element move test</title>
<style type="text/css">

.right {z-index:-1; position: absolute; left: 100px; top: 50px; }

</style>

hi

<div class="right">please help me kind sir</div>
<table width="100%" height="100" border="10">1</table>
 
Upvote 0 Downvote
Your example is incomplete -- it has no head or body tags, you have text outside any tag (but the html tag) and you have a table without actual necessary table elements (tr and td). Furthermore, you have a div that is positioned at z-index -1 which is below the canvas, which is set at 0. So your div won't even show in most of the browsers. Finally, your (invisible) div is probably not moving at all... it is the table that is moving. Div should be 100px from the left and 50px for the top at all times.

___________________________________________________________
[small]Do something about world cancer today: Comprehensive cancer control information at PACT[/small]
 
Upvote 0 Downvote
I'm sorry Dan I didn't know that it mattered here is the actual code. Here is the real code and a better example see when I minimize the browser the links pop outside of their position and outside of the intended position to the right. When the window is maximized they snap back into place. Thanks for the help Dan.

Code: 
<title>help</title>
<STYLE type= text/css>

body { background-color: 050507; background-image: url([URL unfurl="true"]http://www.cayema.com/CBack.gif);[/URL] width="100%"}
h3 {text-align:center;background-color: #94d6e7;}
.tdback { background-image: url([URL unfurl="true"]http://www.cayema.com/crump.jpg);}[/URL]
.hiddenPic {display:none;}
.banner {position:absolute; top: 9%; left: 180px; z-index:200;}
.rotate { position: absolute; left: 756px; top: 212px; }
.content { position: absolute; left: 89px; top: 202px; }
.links { position:absolute; left: 150px; top: -978px; }
.hotlinks { position: absolute; left: 756px; top: 500px; width:119px; }
.right { position: absolute; left:22px; top: 1115px; }

</STYLE>


 						<!--BODY STARTS HERE-->
 <center><img src="[URL unfurl="true"]http://www.cayema.com/mainTopSide.gif"[/URL] class="main">



				 		 		  	<!--Hot Links side Section-->  			   
<div class="hotlinks"><table><center><hr>  
<a href="[URL unfurl="true"]http://www.extremeskins.com"[/URL] target=_blank title="NFL - Washington Redskins website" ONMOUSEOVER="window.status='A website dedicated to the Washington Redskins NFL team';return true"><font color="blue"><center>Extreme Skins</a><hr>
<a href="[URL unfurl="true"]http://www.uptownsports.com"[/URL] target=_blank title="Gear 4 living check it out" ONMOUSEOVER="window.status='Get exclusive styles of clothing here The Uptown Sports brand';return true"><font color="blue"><center>Uptown Sports</a><hr>
<a href="[URL unfurl="true"]http://www.bet.com"[/URL] target=_blank title="Black Entertainment Television website" ONMOUSEOVER="window.status='Get the latest from the Black Entertainment Channel website';return true"><font color="blue"><center>Bet.com</a><hr>
<a href="[URL unfurl="true"]http://www.redskins.com"[/URL] target=_blank title="The online home of the NFL Washington Redskins" ONMOUSEOVER="window.status='Online home of the NFL washington Redskins';return true"><font color="blue"><center>Redskins</a><hr>  
<a href="[URL unfurl="true"]http://www.Jamaicapromote.com"[/URL] target=_blank title="Live Internet Radio" ONMOUSEOVER="window.status='Live radio over the internet, multiple channels to choose from.';return true"><font color="blue"><center>Jamaica Promote</a><hr>
<a href="[URL unfurl="true"]http://www.foundrymusic.com"[/URL] target=_blank title="Get the latest from Opie and Anthony" ONMOUSEOVER="window.status='The latest from Opie and Anthony, plus high quality adult material';return true"><font color="blue"><center>Foundry Music</a><hr>
<a href="[URL unfurl="true"]http://www.myspace.com/cayema"[/URL] target=_blank title="KMA webmaster webpage" ONMOUSEOVER="window.status='Check out the Webmasters myspace page';return true"><font color="blue">KMA Myspace</a><hr>
<a href="kma_feat.php?a_id=18&PHPSESSID=92fe701eb6a9d7bb34edd437a98ff431" ONMOUSEOVER="window.status='Get a hot track for your new single or enter their next musical showcase';return true" title="Get some new beats check out this hot new producer"><font color="blue">Blackcyde Entertainment</a><hr>
<a href="[URL unfurl="true"]www.allhiphop.com"[/URL] ONMOUSEOVER="window.status='Great site for hip hop related stuff';return true" title="New songs and hip hop interviews"><font color="blue">All Hip Hop</a><hr>
<a href="[URL unfurl="true"]www.blackplanet.com"[/URL] ONMOUSEOVER="window.status='This social networking site was around before myspace';return true" title="Before Myspace there was Black Planet"><font color="blue">Black Planet</a><hr>
<a href="[URL unfurl="true"]www.cnn.com"[/URL] ONMOUSEOVER="window.status='Worldwide news website';return true" title="Updated worldwide news website"><font color="blue">CNN News</a><hr>
<a href="kma_feat.php?a_id=14&PHPSESSID=92fe701eb6a9d7bb34edd437a98ff431" ONMOUSEOVER="window.status='Originality at its best a new comic strip and it is all original';return true" title="Check out this unique original comic strip"><font color="blue">Nappy Ninjaz</a><hr>
<a href="kma_feat.php?a_id=19&PHPSESSID=92fe701eb6a9d7bb34edd437a98ff431" ONMOUSEOVER="window.status='Boring crap and lies about the webmaster of this site.';return true" title="Learn all about the webmaster of cayema.com"><font color="blue">Webmaster notes</a><hr>
<a href="[URL unfurl="true"]http://www.cayema.com/Stee-Lo/catalog?PHPSESSID=[/URL]
e7aa621c43c33f2853ba0400157ffc3e" title="Browse our selections" ONMOUSEOVER="window.status='Great deals on the latest styles';return true">Stee-Lo Clothes</a><hr>
<a href="[URL unfurl="true"]http://www.espn.com"[/URL] title="Professional Sports Network" ONMOUSEOVER="window.status='Check out all sports news here';return true">ESPN website</a><hr>
<!--This is the old style for frames.<a href="javascript:location='[URL unfurl="true"]http://www.cayema.com/links.html';parent.main.[/URL]
location='aster.html';parent.banner.location='banner.html'" ONMOUSEOVER="window.status='Boring crap and lies about the webmaster of this site.';return true" title="Learn all about the webmaster of cayema.com"><font color="blue">Webmaster notes</a>// -->
</table></div>
 
Upvote 0 Downvote
You need to validate your code at w3.org. You have open <center> tags, but I don't see any close tags. You open and close a <table>, but I don't see any table rows or cells.

Once you get the code to validate, then let us see what you have if there are still problems.

Lee
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

lmcate
  • Locked
  • Question
From HTML Page open an MDB files on the server and work
Replies
0
Views
203
lmcate
lmcate
cae154
  • Locked
  • Question
Body of email not appearing in correct font on iPhone and iPad
Replies
1
Views
766
spamjim
spamjim
Mike Lewis
  • Locked
  • Question
How to refresh a Javascript file in the browser's cache?
Replies
4
Views
1K
Mike Lewis
Mike Lewis
lmcate
  • Locked
  • Question
Create a Expand/Collapse FAQ Accordion, Collapse other on Click 1
Replies
2
Views
705
Mike Lewis
Mike Lewis
PeDa
  • Locked
  • Question
Display table td's as block element on mobile phone 1
Replies
3
Views
886
spamjim
spamjim

Part and Inventory Search

Sponsor

Back
Top