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!

  • 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!

Resizing Not Stationary

Status
Not open for further replies.

cooldisk2005

Technical User
Aug 3, 2005
119
US
All,
I am working on a webpage that is not stationary when the web browser is resized. The page is here:
When I resize the browser window the main part of the page moves left or right.

I do not want that part to move. I want it to be fixed and not move.

Can anyone tell me how to do this?

I have placed the main part into a relative table, but that is not working.

Any help will be greatly appreciated.

Thanks
 
It's hard to guess what you are considering as a 'main part' and what you consider by moving. But here's an explanation of both.

All the graphical stuff moves beacuse it is in a table (why a table is beyond me), which has a fixed size and resides in a div that sports [tt]align="center"[/tt]. Albeit that is an incorrect way to center block elements, it does still work on pages without proper doctype, such as yours. The graphical stuff moves because it needs to be in the center of the screen at all times.

The text moves because it is in a table (why is this text in a table is even more beyond me than the first table), which is absolutely positioned according to the viewport (= browser window). This table will always be 412px from the left and 106px from the top and it will also never expand in height (even if there be more (or bigger) text to fit in the 38px. Why would you use absolute positioning to put that table there again makes perfect nonsense to me, but I guess it is there.

Possible solutions?
1. Just put the "text" table into the actual "layout" table and you won't have to deal with absolute positioning.
2. Scrap the whole page, read up on how to design websites in 2006 (i.e. and redo the page.

In any case, you should look into obscure closing <center> tags in your code and anything else that is out of place.
 
I found a solution:
<DIV ID="Nav_Layer" STYLE="left: 150px; top: 100px; position:absolute; width:123; height:180">

The reason I am using this method is because I have items I want to position in specific places on this page. I know tables are wrong, but for now I have to make it work. I will continue to read on how to improve on my designing of layouts in this manner.

The page you gave: hotdesign.com/seybold, didn't really give a lot of info, but I will find other sites that deal with more in depth layout designs.

Thanks so much for your help!!!

 
Interestingly enough, reading through that website again, I found that it actually links to about 20 of the best modern web design discussion websites, so I think re-reading the article should get you as deep as you need to be in the new way of designing things.

As for your "solution", I don't know where you put it, but it reeks of trouble. I would not dare test your page anywhere but IE (your "solution" has no values on width and height) or anything that is remotely outside your expected size and shape. Absolute positioning is a powerful tool and definitely has its place in web design but it surely was not designed in a way you are using it.
 
I actually changed the way I did it all together. I created the image in Adobe Photoshop / I then converted that over to Adobe ImageReady / I then sliced it up into the pieces I needed for the web page and then Saved Optimized into an .html file.

This allowed me to do whatever I needed without having to worry about absolute items. I was also able to center it like I wanted.

Thanks again for everything!!!
 
I forgot to mention that the hyperlinked page I have in this thread is not the correct one anymore, because like I said in the last thread, I redid the page and it has another name now.

When I get home from work I will delete the webpage in this thread.

 
Status
Not open for further replies.

Part and Inventory Search

Sponsor

Back
Top