View Full Version : Text Problem

01-30-2005, 05:29 PM
Ok, I have completed this template:


The problm is, the text size changes according to what a persons text size is set to on the IE controls. Is there some kind of code to allow the text size stays the same no matter waht? The reason is, I made using layers, so I need the text to say sonstant.

01-30-2005, 06:36 PM

Welcome to Coding Forums.

The problem seems to me, not to be that your text size is variable but that the template is not. A web site should be designed for accessibility by those who are less well-sighted than many and those who are using huge screens, which can make th whole site look small especially, where the page has been designed more for smaller screens.

Put simply, the user should have the choice of what text size they want to use and that is why this facility was built into the browsers.

What I would suggest as a starting point is to put all your listed things eg div class=123 through to div class129 into their own respective <ul> (un-ordered list), and then you can assign a style to that call of <ul>. This would shorten/simplify the code and make it easier for you to get to a successful result.

If you take a look at my site, you can see how the text can change in size without busting the site. Please ignore the issue of whether you like the design as it is totally a subjective matter. ;)

being shown temporarily

It seems also that the background image that you use (I like it), for the menu, is partly the cause of your restriction. You can achieve almost the same effect with CSS and this would enable you to remove the variable-sized text problem.

If you try those suggestions, then come back so we can look at it again.



01-30-2005, 06:50 PM
So I don I need to put:


on every one of those? <ul> before every <DIV>??

01-31-2005, 10:13 AM
Ehhh... no.
Bazz likely meant using list markup for, well, lists of links, which is a common practice these days. Why? Because it makes perfect sense to mark up an unordered list of links as an unordered list of links. Besides, all the lovely elements make for great styling opportunities.

One of those divs might look like this:

<div class="Object123">
<li><a href="http://##"Home</a></li>
<li><a href="http://##"Forums</a></li>
<li><a href="http://##"Archived News</a></li>
<li><a href="http://##"Staff</left></li>
<li><a href="http://##"Contact Us</a></li>
<li><a href="http://##"Link to Us</a></li>

Each link is now placed in its own list item, which eliminates the need for those breaks; also, instead of those ugly dashes you can use actual bullets (images, if need be).
Notice that I removed the font and left (?!! I didn't even know that existed) elements, which ought to be burned from your memory; use CSS to control font properties and text alignment.
Also, I included a h3 element to hold the list title; you can either use actual text to display it and use a background image to achieve the visual effect, or use some image replacement technique.

More on styling link lists like proposed here can be found in the Listutorial (http://www.maxdesign.com.au/presentation/listutorial/index.htm).

01-31-2005, 01:17 PM
Ooops, I should have posted that code to better explain what I meant. Of course if you checked my own site you'll have seen my hypocracy since I havent used it myself there. Well when I wrote that site, I didn't know about it and I havent time to redo it yet coz I busy well, keeping others busy in the perl forum.

Anyway here's the css format. You can add or remove elements as you need. Play about with it too, it'll help to see the impact that changes to parent styles can have (or not have), on the child processes.

div#navbar {
float : left;
clear : both;
background-color: #ffffb3;
padding: 50px 15px;
margin: 0;
text-align: center;
width : 17%;
height : 900px;
min-width : 100px;
border-right : 1px #000000 solid;
font-family : "comics sans ms", arial, sans serif, helvetica;

font-family : "comic sans ms", sans serif, verdana, arial, helvetica;
text-transform: lowercase;
display: inline;
white-space: nowrap;
margin: 0;
padding: 0;
border-left: 0px #FFFFE5 dashed;

#navlist li{
list-style: none;
border-right: 0px dashed #FFFFE5;
padding: 0;

#navlist a {
padding: 0;

#navlist a:link, #navlist a:visited{
color: #4A364A;
text-decoration: none;
font-weight : bold;

#navlist a:hover{
text-decoration: none;
color: #CEBBBD;

:) Between us, you have got the complete solution.


02-01-2005, 12:04 AM
Well, the links do not show up unless I put the <left></left> and do I put that CSS code in my header?

02-01-2005, 02:42 AM
Yes, you can put CSS in the <head> section by sticking it in <style> tags:

<style type="text/css">
... css ...

Or you can link to it externally. You might want to check out a basic tutorial on CSS if you're planning to dive in and learn some; it'll be much easier than to try to work your way backwards...


I'm confused about the <left> tags... there is no such thing as a <left> tag. This makes me blue with question marks coming out of my head. :confused: See?