Bob
I'm TOTALLY NEW to coding for small screen (iOS mobile devices). I need help ASAP please.
I have problem getting the text elements in correct position in the small screen version of my site.
Questions about css coding:
1.
In upperright corner of my website:
• Contact Us
• Directions
stays on the far right of screen. They won't move. I'd like them to move and center under the FFS logo/address and quote "Celebrating over 180...".
2. and regarding the QUOTE with line above it: "Celebrating over 180..." I'm having problem with its line-height (when it breaks into 2 lines) . It's also running into other elements!
3.
regarding the columns that are now vertical:
why do the 1st 2 columns fill the width of screen but the 3rd column has smaller width?
Please help ASAP! My client is starting to ask questions!! I'm running out of time trying to figure out a lot of stuff on my own.
here is link to my site:
http://www.frankfordfriendsschool.org/CLASSexample3.html
style sheet for small screen:
http://www.frankfordfriendsschool.org/class-smallscreen3.css
if you need this, the regular screen stylesheet:
http://www.frankfordfriendsschool.org/class2.css
and BELOW IS THE CODING for html file:
<html>
</body>
<div id="wrapper">
<header>
<a href="index.html"><img src="/images2014/FFSlogo-address.jpg" alt="Frankford Friends School, 1500 Orthodox Street, Philadelphia, PA" /></a>
<span class="upperright">
#
#
<span class="quote"> Celebrating over 180 Years of Quality, Affordable Quaker Education
</header>
<nav>
Nav links here
</nav>
<!-- Code for a three-column layout under nav bar -->
<div class="columns">
<aside class="left">
Left column
2nd line
3RD LINE
</aside>
<!-- Article is the main content of the page -->
<article>
Main content column
xyz
3rd and 4th line is next
5th line... I dont think so
not 6 either
</article>
<aside class="right">
Right column
wxyzabcd
</aside>
<!-- End columns -->
<!-- Footer at bottom of page (optional) -->
<footer>
Footer content here
</footer>
</div><!-- End wrapper -->
</body>
</html>

Chowhound
Comic Vine
GameFAQs
GameSpot
Giant Bomb
TechRepublic