SitePoint Sponsor |
|
User Tag List
Results 1 to 9 of 9
Thread: Tidier way of doing this code?
Hybrid View
-
Aug 22, 2009, 08:45 #1
- Join Date
- Aug 2009
- Posts
- 10
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Tidier way of doing this code?
Hi
done the course but that doesn't tell you how you could do things.
now I have this code but I am trying to make it smaller less repeating.
HTML Code:<div id="logo" style="position:absolute; left:11px; top:3px; width: 455px; height: 68px; color:black; font-size:32pt;"> my text here</div> <div style="position:absolute; left:12px; top:4px; width: 455px; height: 68px; color:lightblue; font-size:32pt;"> my text here</div> <div style="position:absolute; left:13px; top:4px; width: 455px; height: 68px; color:blue;font-size:32pt;"> <a href="mytexthere.html" style="text-decoration: none">my text here</a></div>
-
Aug 22, 2009, 09:02 #2
- Join Date
- Jul 2007
- Location
- San Jose, California
- Posts
- 355
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Code HTML4Strict:<style type="text/css"><!-- div { width: 455px; height: 68px; position:absolute; font-size:32pt; } --></style> <div id="logo" style=" left:11px; top:3px; color:black; "> my text here </div> <div style="left:12px; top:4px; color:lightblue;"> my text here </div> <div style="left:13px; top:4px;color:blue;"> <a href="mytexthere.html" style="text-decoration: none">my text here</a> </div>
-
Aug 22, 2009, 09:53 #3
- Join Date
- Aug 2009
- Posts
- 10
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Cheers that one way, however I think I am looking for away to do it one line as this will be on every page in the site, I know I could do it with an image but don't what to do it like that.
I have it that I now have a css with a title_a title_b and Title_c and I call them like so.
HTML Code:<div class="title_a";>my text</div> <div class="title_b";>my text</div> <div class="title_c";> <a href="mytext.html" style="text-decoration: none">my text</a></div>
HTML Code:<div class="the_title";> <a href="mytext.html" style="text-decoration: none">my text</a></div>
Now if you think this is a css question then I post a question there.
-
Aug 22, 2009, 13:32 #4
-
Aug 22, 2009, 13:37 #5
- Join Date
- Aug 2004
- Location
- Hamburg, Germany
- Posts
- 4,248
- Mentioned
- 30 Post(s)
- Tagged
- 0 Thread(s)
If you want to use a more modular approach, you could do this as well:
Code CSS:.title { position: absolute; top:4px; width; 455px; height: 68px; font-size: 32pt; } #a { left:11px; top:3px; color: black; } #b { left:12px; color:lightblue; } #c { left:13px; color:blue; }
Code HTML4Strict:<div class="title" id="a"></div> <div class="title" id="b"></div> <div class="title" id="c"></div>
Or:
Code CSS:.title { position: absolute; top:4px; width; 455px; height: 68px; font-size: 32pt; } .title.a { left:11px; top:3px; color: black; } .title.b { left:12px; color:lightblue; } .title.c { left:13px; color:blue; }
Code HTML4Strict:<div class="title a"></div> <div class="title b"></div> <div class="title c"></div>
-
Aug 22, 2009, 14:23 #6
- Join Date
- Aug 2009
- Posts
- 10
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
kohoutek big thanks, some every interesting ways of doing it there, I chose the class id one as that worked when I did it, the others do but thay did not go first time.
-
Aug 22, 2009, 14:28 #7
- Join Date
- Sep 2005
- Location
- Sydney, NSW, Australia
- Posts
- 16,875
- Mentioned
- 25 Post(s)
- Tagged
- 1 Thread(s)
Stephen J Chapman
javascriptexample.net, Book Reviews, follow me on Twitter
HTML Help, CSS Help, JavaScript Help, PHP/mySQL Help, blog
<input name="html5" type="text" required pattern="^$">
-
Aug 22, 2009, 14:54 #8
- Join Date
- Aug 2009
- Posts
- 10
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Thought it would have worked straight away as I am using coffeecup untill have some money to spend on something better that I can get to work, tried Altova still trying to work out how to get to doing something apart from the demos.
Is there a CSS book out there that's worth gettting you know the one that you cannot do without.
-
Aug 22, 2009, 14:58 #9
- Join Date
- Aug 2004
- Location
- Hamburg, Germany
- Posts
- 4,248
- Mentioned
- 30 Post(s)
- Tagged
- 0 Thread(s)
There are plenty of books that are of great value.
- Cascading Stylesheets, the Definitive Guide
- Bulletproof Webdesign
- The Ultimate CSS Reference (Sitepoint)
- CSS Mastery
- Transcending CSS
Those are a few I have read. They're all immensely valuable. There are plenty more than those, but those are my picks.
Bookmarks