|
Hello, As part of a school project, I have to make a website. I have made a template in Photoshop, sliced and exported as web. I have since added a line of code to center the site when displayed on larger displays, but now, any text will not stay in a fixed position on the site; ie, when I make the window bigger, the text does not stay in its correct place. Would anyone be able to suggest a way in which I could resolve this. Please note, I am trying to use a floating text box for the text as the rest of the site is made of images and I am not able to insert tables with out displacing the image. Thanks in advance, Tim |
|
Do you have the width set to auto for the CSS of your text div? eg width: auto !important; I have changed this and the problem still occurs. I have uploaded the site files to www.fontana.me.uk/testsite Would you please be able to have a look and see what you ca think from there. Index.html is before adding auto. I will make it so that navigating to new.html is with your suggestion added. Thanks,m Tim |
|
Try enveloping the entire site in a "Content wrapper". From that point you can set specific components within the page to specific positions (including float). It would be better if you use CSS to do this. You can even write the CSS to the head section of the page in order to see the results immediately and then copy the data to an external CSS page and do a link reference to it later on. It will make the page lighter for loading. Within the CSS, pre-define all sizes and locations for your div's. I have a simple site you can go look at and do a view source from the page to get an idea of what I'm talking about. Go to sjcfd.com. Here's an example from my CSS: contentWrapper { width: 950px; margin-right: auto; margin-left: auto; z-index: 2; } Good luck. Could you please look at this and tell me what you think would be best. I'm a total noob at web but it was the only option that was available to me on the course this year. I looked at it earlier and came up with the idea to place the whole page in a content wrapper. Then set up your table inside one div called banner. Set the properties for that div. Next define a div for the image and text. Set the properties(i.e., left margin:0; right margin 720;, etc.) to position that div within the container where you want it. The right margin is truly the width of the container minus the spacing you want from it. You will also want to center the container. This will help keep the page at center of the window. Okay. I'm not really sure where to put the code you've given me though? Thanks for the help though :) In a nutshell, you can put "Styles" inline (i.e., div class=test style="left-margin: 250px; right-margin: 250px; ..... and so on). You can also define your styles in the Head section (which you already prepared with the styles = text/css). An easy way to learn is to define your styles inline, try them out, refine them, and then once you're happy move them to the head section or better yet move them to an external style sheet. As far as the content wrapper, it will be the very first div you create in the body section and the last div to close. This keeps the contents of the page tightly wrapped inside. |
