LiveWire Network Peer Answers Peer Support Teen Forums Tech Forums College Forums 577 users online 225320 members 779 active today Advertise Here Sign In
TeenCollegeTechPhotos | Quizzes | LiveSecret | Memberlist | Dictionary | News | FAQ
Member Spotlight
Ziggy Stardust
Music: Arctic Monkeys, Muse, Death Cab For Cut...
Mood: Tearful
You have 1 new message.
Emergency Help
Until you sign up you can't do much. Yes, it's free.

Sign Up Now
Membername:
Password:
Already have an account?
Invite Friends
Active Members
Groups
Contests
Moderators
4 online / 33 MPM
Fresh Topics
  LiveWire / Technical Forums / Web Design & Search Engine Optimization / Adding Reply

Adding Reply
Archived Topic: It will not be bumped to the top of the forum.
Topic HTML/CSS my layout shifts?
Membername   Not a member? Sign Up Free (takes 20 seconds)
Password   Forgotten your password?
Post

Font:   Size:   Color:

FAQ Keyword Search:
Post Options
Favorites Manager
Notify me of new replies to this topic by email
Notify me of new replies to this topic by private message
Original Post
RememberTheName Posted at 11:11 am on Nov. 18, 2008
Ooooh boy was I in over my head taking a web design class.  

My first problem (of many to come I'm sure): My layout shifts from one page to another. Like if I'm on the home page and click my feedback, all the navigation buttons will move over to the right. I'm using a layout with tables.  

Is there any way to make sure the layout stays still from page to page using an external style sheet with CSS?

If not how CAN I fix this?

EDIT: I found out what I did wrong, stupid little error. FIXED.

Replies
RememberTheName Posted at 4:33 pm on Nov. 18, 2008
Quote: from stratocaster69 at 4:37 pm on Nov. 18, 2008

yeh im not really a fan of tables

It was either tables or frames for this class, and from my understanding tables are the lesser of the two evils.

RememberTheName Posted at 4:32 pm on Nov. 18, 2008
And here's the feedback page code:

<!DOCTYPE html
PUBLIC"-??W3C//DTD XHTML 1.0 Tranistional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>

<html>
<head>
<title>Preparing for Basic Combat Training in the Army</title>

<meta name="description" content="Advise and comments from actual soldiers and a list of the most helpful sites on learning how to prepare yourself for Basic Combat Training."/>
<meta name="keywords" content="basic combat training, BCT, us army, prepare, getting ready, workout"/>

<link rel="stylesheet" href="styles.css" type="text/css" />

</head>

<a name="top"></a>
<table width="700" heigth="100" align="center"
border="0">
<tr>
<td colspan="3" valign="top" align="center">
<tr>
<td colspan="3" valign="top"
align="center">
<div align="center">
<img src="images/banner4.jpg" width="651" heigth="235"
align="center" alt="This is my banner."/>
</div>
</td>
</tr>
<tr>
<td valign="top" align="center">

<!-- Navagation Area --!>


<a href="index.html">
<img src="images/home1.png" border="0" width="142" heigth="40" />

<a href="index.html">
<img src="images/links1.png" border="0" width="142" heigth="40" />

<a href="index.html">
<img src="images/advise1.png" border="0" width="142" heigth="40" />

<a href="index.html">
<img src="images/bring1.png" border="0" width="142" heigth="40" />

<a href="index.html">
<img src="images/resources1.png" border="0" width="142" heigth="40" />

<a href="feedbackpage.html">
<img src="images/feedback1.png" border="0" width="142" heigth="40" />


</td>
<td valign="top" align="center">


<!-- Spacer Area --!>

</td>
<td valign="top" align="center">


<!-- Content Area --!>


<p>

<form method="post"
action="http://www.mayojohnson.com/bin/form.php";>
<input type="hidden" name="subject" value="Website Feedback">
<input type="hidden" name="recipient"
value="meredithls89@gmail.com">
<table border="1">

<tr>
<td align="center">
<strong>Name:</strong></td>
<td><input type="text" name="name" size="40"></td>
</tr>

<tr>
<td align="center">
<strong>State:</strong></td>
<td><select id="state" name="state" size="1" >
<option value="">Please select State or Province</option>
<option value="AL">Alabama</option>
<option value="AK">Alaska</option>
<option value="AB">Alberta</option>
<option value="AZ">Arizona</option>
<option value="AR">Arkansas</option>
<option value="BC">British Columbia</option>
<option value="CA">California</option>
<option value="CO">Colorado</option>
<option value="CT">Connecticut</option>
<option value="DE">Delaware</option>
<option value="DC">District of Columbia</option>
<option value="FL">Florida</option>
<option value="GA">Georgia</option>
<option value="HI">Hawaii</option>
<option value="ID">Idaho</option>
<option value="IL">Illinois</option>
<option value="IN">Indiana</option>
<option value="IA">Iowa</option>
<option value="KS">Kansas</option>
<option value="KY">Kentucky</option>
<option value="LA">Louisiana</option>
<option value="ME">Maine</option>
<option value="MB">Manitoba</option>
<option value="MD">Maryland</option>
<option value="MA">Massachusetts</option>
<option value="MI">Michigan</option>
<option value="MN">Minnesota</option>
<option value="MS">Mississippi</option>
<option value="MO">Missouri</option>
<option value="MT">Montana</option>
<option value="NE">Nebraska</option>
<option value="NV">Nevada</option>
<option value="NB">New Brunswick</option>
<option value="NH">New Hampshire</option>
<option value="NJ">New Jersey</option>
<option value="NM">New Mexico</option>
<option value="NY">New York</option>
<option value="NL">Newfoundland and Labrador</option>
<option value="NC">North Carolina</option>
<option value="ND">North Dakota</option>
<option value="NT">Northwest Territories</option>
<option value="NS">Nova Scotia</option>
<option value="NU">Nunavut</option>
<option value="OH">Ohio</option>
<option value="OK">Oklahoma</option>
<option value="ON">Ontario</option>
<option value="OR">Oregon</option>
<option value="PA">Pennsylvania</option>
<option value="PE">Prince Edward Island</option>
<option value="PR">Puerto Rico</option>
<option value="QC">Quebec</option>
<option value="RI">Rhode Island</option>
<option value="SK">Saskatchewan</option>
<option value="SC">South Carolina</option>
<option value="SD">South Dakota</option>
<option value="TN">Tennessee</option>
<option value="TX">Texas</option>
<option value="UT">Utah</option>
<option value="VT">Vermont</option>
<option value="VA">Virginia</option>
<option value="WA">Washington</option>
<option value="WV">West Virginia</option>
<option value="WI">Wisconsin</option>
<option value="WY">Wyoming</option>
<option value="YT">Yukon</option>
</select>
</td>
</tr>


<tr>
<td align="center">
<strong>Webstie:</strong></td>
<td><input type="text" name="url" size="40" value="http://";></td>
</tr>

<tr>
<td align="center">
<strong>Email:</strong></td>
<td><input type="text" name="email" size="40"></td>
</tr>

<tr>
<td align="center">
<strong>Comments:</strong></td>
<td><textarea name="comments" cols="30" rows="4"></textarea></td>
</tr>

<tr>
<td align="right" valign="top">
<strong>What is the likelihood you will join the Army?</strong></td>
<td><input type="radio" value="notjoining" name="join">Do not plan on joining<p/>
<input type="radio" value="thinking" name="join">Thinking of joining<p/>
<input type="radio" value="enlisted" name="join">Already Enlisted<p/>
<input type="radio" value="soldier" name="join">I am currently in the Army<p/>
</td>
</tr>

<td align="right" valign="top">
<strong>Was this site helpful?</strong></td><br>
<td><input type="checkbox" value="yes" name="helpful">Yes<p/>
<input type="checkbox" value="somewhat" name="helpful">Somewhat<p/>
<input type="checkbox" value="no" name="helpful">No<p/>
</td>
</tr>
<tr>
<td align="right" valign="top">
<strong>Do you feel prepared for Basic Combat Training?</strong></td>
<td><select name="Coures Offers" size="1">
<option>Yes, I could start tomorrow</option>
<option>Not at the moment, maybe after some more research</option>
<option>Not at all</option>
</select>
<p>

<input type="Submit" Value="Submit">
<input type="Reset" Value="Reset">
</td>
</tr>
</table>
</forms>

</td>
<tr>
<td colspan="3" valign="top"
align="center">


<!-- Footer Area --!>


</td>


<body topmargin="50" leftmargin="120" background="images/leftborder1.jpg"/>

</body>
</html>

RememberTheName Posted at 4:31 pm on Nov. 18, 2008
Quote: from Wheeldon at 3:48 pm on Nov. 18, 2008

Nice video!  

Can we have the site URL so we can have a look at the code?


It's not uploaded to the web yet, but here is the index page code. Thanks so much for looking at it!

<!DOCTYPE html
PUBLIC"-??W3C//DTD XHTML 1.0 Tranistional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd";>

<html>
<head>
<title>Preparing for Basic Combat Training in the Army</title>

<meta name="description" content="Advise and comments from actual soldiers and a list of the most helpful sites on learning how to prepare yourself for Basic Combat Training."/>
<meta name="keywords" content="basic combat training, BCT, us army, prepare, getting ready, workout"/>

<link rel="stylesheet" href="styles.css" type="text/css" />

</head>

<a name="top"></a>
<table width="700" heigth="100" align="center"
border="0">
<tr>
<td colspan="3" valign="top" align="center">
<tr>
<td colspan="3" valign="top"
align="center">
<div align="center">
<img src="images/banner4.jpg" width="651" heigth="235"
align="center" alt="This is my banner."/>
</div>
</td>
</tr>
<tr>
<td valign="top" valign="center">

<!-- Navagation Area --!>

<a href="index.html">
<img src="images/home1.png" border="0" width="142" heigth="40" />

<a href="index.html">
<img src="images/links1.png" border="0" width="142" heigth="40" />

<a href="index.html">
<img src="images/advise1.png" border="0" width="142" heigth="40" />


<a href="index.html">
<img src="images/resources1.png" border="0" width="142" heigth="40" />

<a href="feedbackpage.html">
<img src="images/feedback1.png" border="0" width="142" heigth="40" />

</td>
<td valign="top" align="center">


<!-- Spacer Area --!>

</td>
<td valign="top" align="center">


<!-- Content Area --!>

<div align="center">
<embed src="sounds/cometolife.wma" width="300" heigth="28"
autostart="false" />
</div>

</p>


For anyone wanting to become a soldier, Basic Combat Training is the hardest thing you will most likely have to go through during your journey in the Army. Heading to BCT (Basic Combat Training) is such a huge unknown for many people, but it's no surprise that it will be tough and challenging in almost every aspect. The goal of BCT is to tear you down and build you back up to become a soldier. <i>Preparation</i> before you go in is the best thing you could possibly do to increase your success, and not have this experience be such an unknown frightening mystery.  


<p/>
<h4>Basic Combat Training Site Hub</h4>


I have come across an abundance of web sites, each solving the mystery piece by piece, or should I say site by site. With all the great sites, it can actual become <strong>overwhelming and stressful</strong>! I ended up clicking and taking in the information on one page thinking I was ready to take on the challenge, only to find another site with a bunch of new information. Here I've gathered all of the best sites to be found in one place, as well as advise and comments I have received from soldiers and recruiters, making sure that all of the most helpful information available, you know before going in.  


<blockquote>"Surviving basic training is much more a mental challenge than a physical one." </br> Sgt. Michael Volkin from the book <u>The Ultimate Basic Training Guidebook</u></blockquote>

<p/>

<div align="center">
<object width="425" height="344"><param name="movie" value="http://www.youtube.com/v/BbmsaEVhcbk&hl=en&fs=1";></param><param name="allowFullScreen" value="true"></param><param name="allowscriptaccess" value="always"></param><embed src="http://www.youtube.com/v/BbmsaEVhcbk&hl=en&fs=1"; type="application/x-shockwave-flash" allowscriptaccess="always" allowfullscreen="true" width="425" height="344"></embed></object>
</div>

<P/>

<div align="center">
<a href="http://www.army.mil"; target="new">Official Site</a>
</div>

<p/>


<a href="images/army.png"><img src="images/army.png"width="125" heigth="125"align="justify">

</td>
<tr>
<td colspan="3" valign="top"
align="center">


<!-- Footer Area --!>

<a href="mailto:herher@yahoo.com">Email the webmaster</a>  

</td>


</body>
</html>

stratocaster69 Posted at 2:37 pm on Nov. 18, 2008
yeh im not really a fan of tables
Wheeldon Posted at 1:48 pm on Nov. 18, 2008
Nice video!

Can we have the site URL so we can have a look at the code?

RememberTheName Posted at 11:28 am on Nov. 18, 2008
Quote: from lostwitness at 1:16 pm on Nov. 18, 2008

Well make sure in your external style sheet you have the layout alignment specified (left, center, or right)

I don't really understand the exact problem until I can see it myself though.


I don't have anything in my external sheet other than background color, how do I specify the layout there? Here's what I mean by the "shifting":

I want things to stay still from page to page.

lostwitness Posted at 11:16 am on Nov. 18, 2008
Well make sure in your external style sheet you have the layout alignment specified (left, center, or right)

I don't really understand the exact problem until I can see it myself though.

All 7 previous replies displayed.