[EDIT2]How to divide a div in..[done, now further..]

  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

How do I divide a div, with assigned id, that's 780px long and 23px high in three equal parts, with CSS, so that in the left part there is text to the left, in the middle part, there's centered text, and in the right part, there's text to the right? oh, and the whole div is also centered plus the left and right text is <a href>-ed.

And, also, for example, if that div is INSIDE a page container div. However, is page container necessary? Won't it work the same way if there's two div-s, one under another, like, box1 and box2 for example.

Also, can I give a div a 1px #000000 solid border?

Sorry for asking so much.. the first question is most important anyway.
  • celandine
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 2008
  • Loc: Belgrade, Serbia

Post 3+ Months Ago

hmmm. you can make three new divs inside your div - float them all to the left, make them appropriate widths/ heights and fill them with appropriate text. You don't even have to make divs though (I always do, but honestly couldn't tell you why). You can just make paragraphs of text, and then style them in the same way in which you'd style a div - like:

Code: [ Select ]
p { }



you href them in the html, like you would regularly. You don't necessarily need a container/ wrapper div, you can just have box under box under box, but I always like to have one wrapper just to keep a handle on things. that's just me though.

you can give the div a border through css - just like that -

Code: [ Select ]
#div {
border: 1px solid #000
}
  1. #div {
  2. border: 1px solid #000
  3. }
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8416
  • Loc: USA

Post 3+ Months Ago

if you just use
Code: [ Select ]
p { }
it would style EVERY paragraph in the document, and I'm not sure HKt0p5 would like that. Either give the paragraphs their own class or id
Code: [ Select ]
p.class { }
p#id { }
  1. p.class { }
  2. p#id { }
or put them in a div and style the p
Code: [ Select ]
#div p { }
or just simply style the div
Code: [ Select ]
#div { }
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

Of course, thanks! I'll make sure to try it later and even post the result because if it works out it'll be quite a leap ahead for me - successful moving on from tables to div-s! ^v^
I have one more question before that though. Since Bogey is right about the p, I'll need to use p id-s (classes are a total jungle to me), exactly in what order, and moreover how and where, do I setup this p's properties about the font colour (and the links a hover, active, visited, blah blah) IN the CSS and not the usual <style> thing that i used to put in the html in the head? I'd also ask for font face but I realized it seems to be not that necessary to define a font when you intend cross-browser/OS compatyness since I can never be sure if the font I define is available on a Mac, or that some user hasn't set up their own default font in their browser's options. Size would be good too, but again, I wonder.. So just colour.

Randomly, can there be such thing like a#id? ._.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8416
  • Loc: USA

Post 3+ Months Ago

Here... what you put in <style> would not change for the CSS file... all that would change is that you don't have to define the <style> and </style>. I mean you don't have to put those before and after the CSS.

About the paragraphs, if you want them to be in 3 seperate columns, you would probably use the float: left; available in CSS. After those, you will need to create a class or an ID clearing them (clear: both; to clear the floats.

If you want me to, I can post a simple example of what you are trying to do and you can go from there, but that would cripple your education of creating a CSS based site rather than a table based.

As for links, sure, you can do that. I do that with my sites as well, except I use classes for those rather then IDs. Because classes are... well, classes. More than one element on the page could have it, but if it's ID, your not supposed to have more than one of those present on a page... the browser renders it but your not supposed to put more than one of the same ID on one page. And I tend to re-use a style for links since there is a big possibility that there would be more than one link in that space that would need that style.

Code: [ Select ]
a.class {
 
}
 
a:active.class {
 
}
 
a:hover.class {
 
}
 
a:visited.class {
 
}
  1. a.class {
  2.  
  3. }
  4.  
  5. a:active.class {
  6.  
  7. }
  8.  
  9. a:hover.class {
  10.  
  11. }
  12.  
  13. a:visited.class {
  14.  
  15. }


But if you want to use IDs even though, just replace .class with #id. (Just for clarity, an ID doesn't have to be a number :lol: )

font-size: well... font size
color: color of the text
text-align: left, center, or right (justify as well but some browsers don't do that :roll: )
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

I'm trying to remake this page properly, not with tables, but div-s. You can check my source code, if it'll help. Right now I'm trying to write all that div stuff and everything but.. give me some more time to try, ok?
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

I've been trying and trying but for some reason, the clear:both; doesn't clear anything. Please, Bogey, post an example so I can see how it's done to actually work.
It won't ruin my CSS learning that much since I'll try to figure it out ad then make one myself from scratch.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8416
  • Loc: USA

Post 3+ Months Ago

Here's how I would setup my CSS file (This is how I do it anyway). This example is for a width of 740px.
CSS Code: [ Select ]
* {
 margin: 0;
 padding: 0;
}
 
body {
 padding-top: 50px;
}
 
#container {
 width: 740px;
 margin: 0 auto;
 background-color: #cecece;
}
 
#container h1 {
 background-color: #aaa;
 color: #000;
 text-align: center;
}
 
#left {
 float: left;
 width: 90px;
 padding: 5px 5px 5px 5px;
 background-color: #cccccc;
}
 
#center {
 float: left;
 width: 530px;
 padding: 5px 5px 5px 5px;
 background-color: #eeeeee;
}
 
#right {
 float: left;
 width: 90px;
 padding: 5px 5px 5px 5px;
 background-color: #cccccc;
}
 
.clear {
 clear: both;
 text-align: center;
 font-size: 12px;
 color: #000000; /* Default color */
}
  1. * {
  2.  margin: 0;
  3.  padding: 0;
  4. }
  5.  
  6. body {
  7.  padding-top: 50px;
  8. }
  9.  
  10. #container {
  11.  width: 740px;
  12.  margin: 0 auto;
  13.  background-color: #cecece;
  14. }
  15.  
  16. #container h1 {
  17.  background-color: #aaa;
  18.  color: #000;
  19.  text-align: center;
  20. }
  21.  
  22. #left {
  23.  float: left;
  24.  width: 90px;
  25.  padding: 5px 5px 5px 5px;
  26.  background-color: #cccccc;
  27. }
  28.  
  29. #center {
  30.  float: left;
  31.  width: 530px;
  32.  padding: 5px 5px 5px 5px;
  33.  background-color: #eeeeee;
  34. }
  35.  
  36. #right {
  37.  float: left;
  38.  width: 90px;
  39.  padding: 5px 5px 5px 5px;
  40.  background-color: #cccccc;
  41. }
  42.  
  43. .clear {
  44.  clear: both;
  45.  text-align: center;
  46.  font-size: 12px;
  47.  color: #000000; /* Default color */
  48. }
And here is how I would setup my HTML file
HTML Code: [ Select ]
<html>
<head>
 <title>Document</title>
 <link href="style.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<h1>Header</h1>
<div id="left">
 <p>Left text</p>
</div>
<div id="center">
 <p>Center text</p>
 <p>Center text</p>
 <p>Center text</p>
 <p>Center text</p>
 <p>Center text</p>
 <p>Center text</p>
</div>
<div id="right">
 <p>Right text</p>
</div>
<p class="clear">Footer</p>
</div>
</body>
</html>
  1. <html>
  2. <head>
  3.  <title>Document</title>
  4.  <link href="style.css" rel="stylesheet" type="text/css" />
  5. </head>
  6. <body>
  7. <div id="container">
  8. <h1>Header</h1>
  9. <div id="left">
  10.  <p>Left text</p>
  11. </div>
  12. <div id="center">
  13.  <p>Center text</p>
  14.  <p>Center text</p>
  15.  <p>Center text</p>
  16.  <p>Center text</p>
  17.  <p>Center text</p>
  18.  <p>Center text</p>
  19. </div>
  20. <div id="right">
  21.  <p>Right text</p>
  22. </div>
  23. <p class="clear">Footer</p>
  24. </div>
  25. </body>
  26. </html>

That is a simple three column layout... going off a little from your site.
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

Bogey, I love you! Haha. Thanks very much!!
The problem was that I actually couldn't figure out how exactly to "phrase" the markup for a class. Now looking at that and actually making the page with the CSS, the codes you showed me, I think I'm starting to get it.
So now I'm going to try remember what goes where and what depends on what and see what I can do with my stupid index following this "logic". Also, i want to experiment what'll happen if I stick a !DOCTYPE to it.
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

Okay, here is the result.
http://hirasawa2032.com/atarashii_index.html

Bogey's code helped me a lot, but there were some parts I had to put like he had, for example, I didn't know how to make that #container h1 thingy some other way to keep the formatting. In the CSS, I played around with the a class thingy, and finally, when it worked, I'm happy I wrote that part entirely myself.

Anyhow, now.. for some reason, it doesn't display centered in IE. here are the codes, so any suggestion how to fix this is very very welcome!
HTML:
Code: [ Select ]
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=EUC-JP" />
<meta http-equiv="content-language" content="ja" />
<meta name="description" content="HIRASAWA KANKAKU - Unofficial side-project website presentation for Hirasawa Susumu including Hirasawa 3D Live, Transparent Sky animation featuring him, analysis of his work, detailed information and history of P-MODEL, MANDRAKE and related; HIRASAWA NATION videogame development and much more. By Taira." />
<meta name="robots" content="index,follow" />
<meta name="keyword" content="平沢進,Susumu Hirasawa,hirasawa susumu,hirazawa,平沢,進,平ら,Taira,P-モデル,transparent,sky,project,Transparent Sky Project,トランスパレントスカイ,「トランスパレントスカイ」,TESLAKITE,Interactive live,2032,インタラクティブ・ライブショウ,プロジェクト,プレゼンテーション,P-MODEL,Mandrake,マンドレイク,Global,Trotters,核P-MODEL,KAKU,hirasawa kankaku,平沢感覚,kankaku,感覚,平沢進3Dライブ,HIRASAWA NATION,videogame,平沢ネーション,平沢ネーションビデオゲーム,ヒラサワ,ヒラサワ・ネーション" />
<meta name="author" content="平沢感覚" />
<meta name="copyright" content="平沢進、平ら" />
<title>平沢進「トランスパレントスカイ」2032プロジェクト</title>
<link rel="shortcut icon" href="http://www.hirasawa2032.com/favicon.ico" />
<link rel="stylesheet" href="index.css" />
</head>
<body>
<div id="container">
<h1><img src="img/pi-duaicylinder.gif" alt="pi-duaiシリンダー"><img src="img/top.gif"></h1>
<div id="hidari">
<p><a class="nihongo" href="#">日本語</a></p>
</div>
<div id="mannaka">
<p>Copyright (C)1987-2008 平沢進、平ら</p>
</div>
<div id="migi">
<p><a class="eigo" href="#">English</a></p>
</div>
<p class="counter"><img src="/cgi-sys/Count.cgi?df=hirasawa.dat|display=Counter|ft=1|md=8|frgb=0;0;0|dd=G"></p>
</div>
</body>
</html>
  1. <html>
  2. <head>
  3. <meta http-equiv="content-type" content="text/html; charset=EUC-JP" />
  4. <meta http-equiv="content-language" content="ja" />
  5. <meta name="description" content="HIRASAWA KANKAKU - Unofficial side-project website presentation for Hirasawa Susumu including Hirasawa 3D Live, Transparent Sky animation featuring him, analysis of his work, detailed information and history of P-MODEL, MANDRAKE and related; HIRASAWA NATION videogame development and much more. By Taira." />
  6. <meta name="robots" content="index,follow" />
  7. <meta name="keyword" content="平沢進,Susumu Hirasawa,hirasawa susumu,hirazawa,平沢,進,平ら,Taira,P-モデル,transparent,sky,project,Transparent Sky Project,トランスパレントスカイ,「トランスパレントスカイ」,TESLAKITE,Interactive live,2032,インタラクティブ・ライブショウ,プロジェクト,プレゼンテーション,P-MODEL,Mandrake,マンドレイク,Global,Trotters,核P-MODEL,KAKU,hirasawa kankaku,平沢感覚,kankaku,感覚,平沢進3Dライブ,HIRASAWA NATION,videogame,平沢ネーション,平沢ネーションビデオゲーム,ヒラサワ,ヒラサワ・ネーション" />
  8. <meta name="author" content="平沢感覚" />
  9. <meta name="copyright" content="平沢進、平ら" />
  10. <title>平沢進「トランスパレントスカイ」2032プロジェクト</title>
  11. <link rel="shortcut icon" href="http://www.hirasawa2032.com/favicon.ico" />
  12. <link rel="stylesheet" href="index.css" />
  13. </head>
  14. <body>
  15. <div id="container">
  16. <h1><img src="img/pi-duaicylinder.gif" alt="pi-duaiシリンダー"><img src="img/top.gif"></h1>
  17. <div id="hidari">
  18. <p><a class="nihongo" href="#">日本語</a></p>
  19. </div>
  20. <div id="mannaka">
  21. <p>Copyright (C)1987-2008 平沢進、平ら</p>
  22. </div>
  23. <div id="migi">
  24. <p><a class="eigo" href="#">English</a></p>
  25. </div>
  26. <p class="counter"><img src="/cgi-sys/Count.cgi?df=hirasawa.dat|display=Counter|ft=1|md=8|frgb=0;0;0|dd=G"></p>
  27. </div>
  28. </body>
  29. </html>


Ignore that for links I put only #, that's just for now until I manage to keep it centered in all browsers.

CSS:
Code: [ Select ]
*{
margin: 0;
padding: 0;
}
body { font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3";
padding-top: 35px;
background:#333333;
}
 
a.nihongo:link
{
text-decoration:none;
font-weight:bold;
font-size: 14px;
color:#ffffff;
}
a.nihongo:visited
{
text-decoration:none;
font-weight:bold;
font-size: 14px;
color:#ffffff;
}
a.nihongo:active
{
text-decoration:none;
font-weight:bold;
font-size: 14px;
color:#ffffff;
}
a.nihongo:hover
{
text-decoration:underline overline;
font-weight:bold;
font-size: 14px;
color:#ffffff;
}
 
a.eigo:link
{
text-decoration:none;
font-size: 14px;
color:#ffffff;
}
a.eigo:visited
{
text-decoration:none;
font-size: 14px;
color:#ffffff;
}
a.eigo:active
{
text-decoration:none;
font-size: 14px;
color:#ffffff;
}
a.eigo:hover
{
text-decoration:underline overline;
font-size: 14px;
color:#ffffff;
}
 
#container {
width: 782px;
height: 373px;
margin: 0 auto;
background-color: #333333;
}
 
#container h1 {
background-color: #666666;
border: 1px solid #000;
}
 
#hidari {
float: left;
width: 220px;
padding: 5px 5px 5px 5px;
background-color: #000000;
}
 
#mannaka {
float: left;
text-align: center;
width: 312px;
padding: 5px 5px 5px 5px;
background-color: #000000;
font-size: 14px;
color: #666666;
}
 
#migi {
float: left;
text-align: right;
width: 220px;
padding: 5px 5px 5px 5px;
background-color: #000000;
}
 
.counter {
clear: both;
text-align: center;
background-color: #333333;
}
  1. *{
  2. margin: 0;
  3. padding: 0;
  4. }
  5. body { font-family: "Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3";
  6. padding-top: 35px;
  7. background:#333333;
  8. }
  9.  
  10. a.nihongo:link
  11. {
  12. text-decoration:none;
  13. font-weight:bold;
  14. font-size: 14px;
  15. color:#ffffff;
  16. }
  17. a.nihongo:visited
  18. {
  19. text-decoration:none;
  20. font-weight:bold;
  21. font-size: 14px;
  22. color:#ffffff;
  23. }
  24. a.nihongo:active
  25. {
  26. text-decoration:none;
  27. font-weight:bold;
  28. font-size: 14px;
  29. color:#ffffff;
  30. }
  31. a.nihongo:hover
  32. {
  33. text-decoration:underline overline;
  34. font-weight:bold;
  35. font-size: 14px;
  36. color:#ffffff;
  37. }
  38.  
  39. a.eigo:link
  40. {
  41. text-decoration:none;
  42. font-size: 14px;
  43. color:#ffffff;
  44. }
  45. a.eigo:visited
  46. {
  47. text-decoration:none;
  48. font-size: 14px;
  49. color:#ffffff;
  50. }
  51. a.eigo:active
  52. {
  53. text-decoration:none;
  54. font-size: 14px;
  55. color:#ffffff;
  56. }
  57. a.eigo:hover
  58. {
  59. text-decoration:underline overline;
  60. font-size: 14px;
  61. color:#ffffff;
  62. }
  63.  
  64. #container {
  65. width: 782px;
  66. height: 373px;
  67. margin: 0 auto;
  68. background-color: #333333;
  69. }
  70.  
  71. #container h1 {
  72. background-color: #666666;
  73. border: 1px solid #000;
  74. }
  75.  
  76. #hidari {
  77. float: left;
  78. width: 220px;
  79. padding: 5px 5px 5px 5px;
  80. background-color: #000000;
  81. }
  82.  
  83. #mannaka {
  84. float: left;
  85. text-align: center;
  86. width: 312px;
  87. padding: 5px 5px 5px 5px;
  88. background-color: #000000;
  89. font-size: 14px;
  90. color: #666666;
  91. }
  92.  
  93. #migi {
  94. float: left;
  95. text-align: right;
  96. width: 220px;
  97. padding: 5px 5px 5px 5px;
  98. background-color: #000000;
  99. }
  100.  
  101. .counter {
  102. clear: both;
  103. text-align: center;
  104. background-color: #333333;
  105. }


And one more little thing, in Safari, my counter doesn't display properly. Check it with Safari to see what it says. Any ideas why that happens?
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8416
  • Loc: USA

Post 3+ Months Ago

I don't know why it doesn't center in IE. All of my sites that are centered, and divided, I use the same technique as I provided here... but I don't know why it's doing that... I have tried quite a few things and none of them worked. I gotta go now so when I leave, I'll provide more input to this.
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

Wait, Bogey! I figured it.. I think. Although I know very well this is definately NOT the way, for now I think this works (at least on my IE 7):
Code: [ Select ]
<!--[if lt IE 7]><div align="center"><style type="text/css">
#hidari {text-align: left; width: 220px;}
#migi {text-align: right;width: 250px;}</style><![endif]-->
<!--[if gte  IE 7]><div align="center"><style type="text/css">
#hidari {text-align: left;width: 220px;}
#migi {text-align: right;width: 250px;}</style><![endif]-->
  1. <!--[if lt IE 7]><div align="center"><style type="text/css">
  2. #hidari {text-align: left; width: 220px;}
  3. #migi {text-align: right;width: 250px;}</style><![endif]-->
  4. <!--[if gte  IE 7]><div align="center"><style type="text/css">
  5. #hidari {text-align: left;width: 220px;}
  6. #migi {text-align: right;width: 250px;}</style><![endif]-->

See where I changed the property for the width, since on Firefox, for example, the normal width is rendered properly but on IE, it seems it needed more pixels to fit. Also, I added my everlasting deprecated, haha, favourite <div align="center"> and it DID center but then I had to additionally define in #hidari, that is, the left (in Japanese) that the text ALSO has to be the left (initially it put the text in the center of #hidari).
Here, I uploaded one with this small change, feel free to compare the two.
http://hirasawa2032.com/atarashii_index.html
http://hirasawa2032.com/index_with_ifs.html

I read a lot about that actually this is some bug or something in IE with floating divs and remembered the if-things I fought a lot on phppBB3 and XOOPS so I thought I might try it. I also thought about absolute positioning but then, how would I know where to position the thing so it's in the center of someone's.. say, 50-inch monitor for example.
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8416
  • Loc: USA

Post 3+ Months Ago

Well, both of them work perfectly in Firefox, but in IE the second one is the only one that is centered.

But I think that IE8 is deprecating the IFs thing... I think they are removing them because they don't want you messing with the IFs... they want it way harder on you :x
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

Yes, the second one is the one with the if-s. But then.. honestly, I don't think that many people use IE, especially, wow, 8. Another thing is that my site is a bit biased - I mean, targeted mostly at Japanese audience who are mostly on Macs, or the few on Windows honestly prefer Firefox or Opera.
Although for now, is it OK to leave it like that, and continue on with my next pages?
  • Bogey
  • Genius
  • Genius
  • Bogey
  • Posts: 8416
  • Loc: USA

Post 3+ Months Ago

Its, it's ok, since I'm sure that the error is an CSS error and since all of the pages use one CSS, if you fix one page then you fix all of them at once... unless I'm wrong and this is actually an HTML error, you can go ahead and work on your other pages.

Also, I would suggest to go for XHTML Valid site... just look through the validator at W3 and see the errors you get.. they're not biggie errors and are easily fixed. Such as the ALT attribute to images.
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

I see.
Well, you're a bit wrong though. This css was only for the index. SOME parts of it will apply to other pages as well though, but the way I planned it, I'll have more other css-s for the different pages. not too many, but.. a few I guess. And probably I'll have to stick those if-s in every one of them..for now.

Here I want to implement my ENORMOUS thanks to you, Bogey, because it was your code that helped me understand classes. I read tons of tutorials, in English AND Japanese, and nowhere it was actually shown what is for what, what goes where and why and how it practically works.

Then. Nh, the validator. The CSS validator is OK, but that other one.. for some reason, even if I stick the most perfect page in it, it still says there are errors. It is either W3 don't exactly know their own standards, or that I just don't understand why it detects, for example, perfectly formatted tags as errors. Anyhow..

And about deprecating the if-s. Well, if these are to be deprecated, how then millions of people who use platforms like phpBB, XOOPS, Movable type, WordPress, etc. will actually keep using them properly? There is alsways "upgrade! and "upgrade change codes package or die!" but there are still if-s in there.

Just to note, I'm not arguing at all, or disagreeing or even rising tone, I'm just thinking (while being a bit drunk). "Deprecated", okay, that all right. But how MUCH "deprecated" it is? As long as I see it displays, then what is the "depracted" with it? If that means a certain tag will be non-existant anymore, yes. But, you put that tag with its proper values, and kindly close this tag afterwards and there, it IS a tag and it DOES work. If certain tags are to become, for example, "deprecated"(+sarcasm) like this one <ohyestag>something happens here</ohyestag>, then I'd admit it is deprecated. There are no more tricks to override it no matter with CSS, HTML, DHTML, XHTML, DXHTML or even DXHTMLCSSXMLWHATEVERHTML!, it won't display in even "JohnAtanasovBrowser", and simply W3 almighty shogunate says "so deprecated it doesn't exist as a tag anymore, we deleted it from the face of any web markup!", that is FINALLY deprecated. Not that they can really control the endless WWWeb and the endless Markup used in it, so, practically, there will always be a way to use the same tag again, just that a bit differently or similarly "spoken".
I apologize for the rant, but I'm actually annoyed with W3 and their mess; and most of all, failing over and over to declare to web designers WHAT EXACTLY is wanted of them. The W3 validator is a php machine monster - and we are NOT web markup scripting such. Human beings we are being, hellooo - is what someone should tell W3. Not to mention, I have my doubts the entire W3 thing might be a big evil AI.


Back on topic...
I'm starting to sketch my two main pages and experiment how to id the div-s, class the p-s and a-s and such. I think it's actually fun when you "get the hang of it"(that right in English?) :lol:
  • HKt0p5
  • Graduate
  • Graduate
  • User avatar
  • Posts: 135
  • Loc: Bulgaria

Post 3+ Months Ago

Well, I made some progress. SOME.
http://hirasawa2032.com/main.html
It's definately a mess and I'll probably have to add a gajillion if-s.. but.. ideas for a better solution are most welcome in the meanwhile!
Also, I found out I have to fix the link things with using an <ul> a bit too late, so I'll get down to that later as well.. I'm totally tired right now so I think I'll go get some rest. I can't even ask everything I wanted but..
For starters, how do I make the two ..things (which are a million id'd div-s) under where it says "English" to the right, to match height..

P.S. ..whatever you do.. DON'T look at that with IE. Please :(
  • celandine
  • Mastermind
  • Mastermind
  • User avatar
  • Posts: 2008
  • Loc: Belgrade, Serbia

Post 3+ Months Ago

why do you have so many problems centering? I'll take a look at it tomorrow...... you shouldn't have to use 'if's' at all.....

Post Information

  • Total Posts in this topic: 18 posts
  • Users browsing this forum: No registered users and 18 guests
  • You cannot post new topics in this forum
  • You cannot reply to topics in this forum
  • You cannot edit your posts in this forum
  • You cannot delete your posts in this forum
  • You cannot post attachments in this forum
 
 

© 1998-2014. Ozzu® is a registered trademark of Unmelted, LLC.