Advertise Here
« previous next »
Pages: [1]

Author Topic: A little css problem  (Read 5985 times)

0 Members and 1 Guest are viewing this topic.

Offline Corrupted Games

  • SMF For Free Newbie
  • *
  • Posts: 15
    • View Profile
    • Corrupted Games

    • Total Badges: 10
    Badges: (View All)
    Topic Starter Combination Level 2 Level 1 10 Posts
A little css problem
« on: December 22, 2008, 11:56:23 pm »
I'm currently in the process of changing my family's football related competitions website and was looking to convert from tables to floating divs, but I have one slight problem.

This problem is that when viewing the website with floats you cant change the size of the browser without discombobulating the entire sites layout.

For example if i have the following layout

AA
BC
DD

AA= Header
B=Navigation
C=News/Main Portion
DD=Footer

and you shrink the browser screen the layout cahnges to

AA
B
C
DD

Which I find to be an issue as im sure something smilar would happen if my aunt views it on her cell phone.

I was wondering if there was anyway to fix this problem?
Logged

Offline Celebrus

  • SMF For Free Hero
  • *
  • Posts: 941
    • View Profile
    • Vikhyat Korrapati

    • Total Badges: 16
    Badges: (View All)
    Topic Starter Combination Level 3 Level 2 Level 1
Re: A little css problem
« Reply #1 on: December 23, 2008, 02:29:17 am »
It would be nice if you could provide your code.

This may help.
Logged

Offline Colette Brunel

  • SMF For Free Sr. Member
  • *
  • Posts: 424
    • View Profile

    • Total Badges: 17
    Badges: (View All)
    Poll Voter Level 4 Fourth year Anniversary Windows User Topic Starter
Re: A little css problem
« Reply #2 on: December 23, 2008, 09:50:46 am »
Quote from: Corrupted Games on December 22, 2008, 11:56:23 pm
Which I find to be an issue as im sure something smilar would happen if my aunt views it on her cell phone.

Create an alternative stylesheet for cell phone users. Make the action (via PHP or Perl) ?;wap.
Logged

Offline Corrupted Games

  • SMF For Free Newbie
  • *
  • Posts: 15
    • View Profile
    • Corrupted Games

    • Total Badges: 10
    Badges: (View All)
    Topic Starter Combination Level 2 Level 1 10 Posts
Re: A little css problem
« Reply #3 on: December 23, 2008, 05:19:26 pm »
heres the code
Code: [Select]
<html>
<head>
<style type="text/css">
body {
background: #000000;
color: #0000FF; }

.header {
border: 2px solid #0000A3;
width: 100%;
color: #FFFFFF; }

.nav {
border: 2px ridge #0000FF;
width: 24%;
height: 500px;
float: left; }

.main {
border: 2px ridge #0000FF;
width: 75%;
height: 500px;
float: right; }

.footer {
border: 2px solid #0000A3;
width: 100%;
color: #FFFFFF; }
</style>
</head>
<body>
<div class="header"><center><font size="7">HEADER HERE</center></font></div><br>
<div class="nav">
<center>Navigation</center>
<hr color="FFFF00">
<a href="#">Link 1</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
<a href="#">Link 4</a>
<a href="#">Link 5</a>
</div>
<div class="main">
News and stuff here
</div>
<br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>
<div class="footer">Copyright Info and Stuff</div>
</body>
</html>
Logged
Pages: [1]
« previous next »
 

Related Topics

  Subject / Started by Replies Last post
3 Replies
902 Views 		Last post July 06, 2006, 05:46:33 pm
by Bailey
1 Replies
768 Views 		Last post October 24, 2006, 05:51:54 pm
by foxx
23 Replies
2772 Views 		Last post January 10, 2007, 01:52:46 am
by Laugh-nd-kid
3 Replies
849 Views 		Last post January 30, 2008, 07:07:20 am
by LaundryLady
13 Replies
1431 Views 		Last post February 11, 2008, 09:37:20 pm
by moodylady