SillyBilly Posted February 17, 2006 Share Posted February 17, 2006 I have set up a family tree using the pre tag, and have used blue and pink for the colors of males and females. I have a CSS for all the pages, but am a bit concerned that I have to use the font color tag for each person on the tree. For example, <font color=#87cefa>Peter</font> and <font color=#ff00ff>Carol</font> Is this too much markup? Should I be including it in the CSS and if so How?Any comments and suggestions would be appreciated. Link to comment Share on other sites More sharing options...
scott100 Posted February 17, 2006 Share Posted February 17, 2006 (edited) Font is old skool don't use it anymore, use css and in this case classes, create one for male and one for female and then call them like so: <head><style>.male{ color:blue;}.female{ color:pink;}</style></head><body><p class="male">Peter</p><p class="female">Carol</p><p class="male">Stuart</p><p class="female">Lynn</p><h1 class="male">Bob</h1><h1 class="female">Linda</h1><p>This is a paragraph containing a <span class="male">male</span> and a <span class="female">female</span>.</p></body> Edited February 17, 2006 by scott100 Link to comment Share on other sites More sharing options...
SillyBilly Posted February 17, 2006 Author Share Posted February 17, 2006 Font is old skool don't use it anymore, use css and in this case classes, create one for male and one for female and then call them like so: <head><style>.male{ color:blue;}.female{ color:pink;}</style></head><body><p class="male">Peter</p><p class="female">Carol</p><p class="male">Stuart</p><p class="female">Lynn</p><h1 class="male">Bob</h1><h1 class="female">Linda</h1><p>This is a paragraph containing a <span class="male">male</span> and a <span class="female">female</span>.</p></body> <{POST_SNAPBACK}> Thank you Scott for your reply and code.I will call the main CSS in the head and then add the code in the style tag. That will override the font-color of the CSS when needed because the tree branches are yellow, which is the font color in the CSS.I will also leave the strong tag around the surname.Trusting that this is correct.EDIT: The p tag starts a new line at the left margin. I want to start the name at predetermined spots on the page using the pre tag.EDIT2: I have a work around by putting many to get to the predetermined spot. Is this the way?Bill Link to comment Share on other sites More sharing options...
scott100 Posted February 17, 2006 Share Posted February 17, 2006 You could use pre or but css allows you to postion elements on a page, for example set it's position to absolute then say where you want it placed on the page with the top left of the screen being 0,0 co-ordinates, have a look: <head><style>.male{ color:blue;}.female{ color:pink;}</style></head><body><p class="male">Peter</p><p class="female">Carol</p><p class="male">Stuart</p><p class="female">Lynn</p><h1 class="male">Bob</h1><h1 class="female">Linda</h1><p>This is a paragraph containing a <span class="male">male</span> and a <span class="female">female</span>.</p><div class="male" style="position:absolute;top:450px;left:500px;">I am absolute positioned male</div><div class="female" style="position:absolute;top:50px;left:200px;">I am absolute positioned female</div><div class="male" style="position:absolute;top:0px;left:300px;"><h1>I am absolute positioned male2</h1></div><div class="female" style="position:absolute;top:210px;left:20px;"><h1>I am absolute positioned female2</h1></div></body> Link to comment Share on other sites More sharing options...
SillyBilly Posted February 17, 2006 Author Share Posted February 17, 2006 You could use pre or but css allows you to postion elements on a page, for example set it's position to absolute then say where you want it placed on the page with the top left of the screen being 0,0 co-ordinates, have a look:<head><style>.male{ color:blue;}.female{ color:pink;}</style></head><body><p class="male">Peter</p><p class="female">Carol</p><p class="male">Stuart</p><p class="female">Lynn</p><h1 class="male">Bob</h1><h1 class="female">Linda</h1><p>This is a paragraph containing a <span class="male">male</span> and a <span class="female">female</span>.</p><div class="male" style="position:absolute;top:450px;left:500px;">I am absolute positioned male</div><div class="female" style="position:absolute;top:50px;left:200px;">I am absolute positioned female</div><div class="male" style="position:absolute;top:0px;left:300px;"><h1>I am absolute positioned male2</h1></div><div class="female" style="position:absolute;top:210px;left:20px;"><h1>I am absolute positioned female2</h1></div></body> <{POST_SNAPBACK}> WoW! scott are you fast. I was getting a screenshot to display what I was trying to do. I have 9 pages of family trees that need to be recoded. That is going to be a job.Thanks for your help. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now