Jump to content

Part of 2nd div color black and place of flags?


eduard

Recommended Posts

How do I get a part (left) of the 2nd div in background color black and the american flag before webdesign and the spanish flag before disenador? <!DOCTYPE html> <html>v><head> <meta http-equiv="content-type" content="text/ html; charset=UTF-8"> <title>Eduard Lid</title> <link rel="stylesheet" type="text/css" href="ex1.css"> </head><body> <div id="container"><p id="name">Eduard Lid</span></p></div> <div id="main"><p id+"buttons"></div> <div id="bottom"><ul id="links"><li><a href="american.html">more</a></li><li><a href="spanish.html">más</a></li> </ul><p id="design">web<br>design diseñar<span id="copyright">Copyright © 2013</span></p> <a href="http://ar.linkedin.com/in/eduardlid"> <<img id="rot" src="http://www.linkedin.com/img/webpromo/btn_viewmy_120x33_es_ES.png?locale=" width="120" height="33" border="0" alt="Ver el perfil de Eduard Lid en LinkedIn" /* Rotate div */ </a> </div> </div> </body></html> * { margin:0; padding:0; list-style-type:none;}body{ font: bold 15px arial,geneva,SunSans-Regular,sans-serif; background-color:#000000; } #container{clear:both;position:relative;background-color:#000000;width:100%;height:120px;} #name{ font-size:50px; color:#7fff00; text-align:center;} #main { clear:both; position:relative; height:280px; background-color:#fffff0; border:4px solid #808080;} #bottom {background-color:#000000;height:80px;} links { float:left; padding:10px 0 0 100px; font-size:12px;}#links li { margin-bottom:5px;}#links a { color:#ffffff;}#links a:hover { color:#696969;}#flags { float:right; width:256px; height:20px; margin:10px 0px; } #flags li { position:relative; float:left; width:24px; margin:0 2px; font-size:8%; font-weight:normal; } #flags a,#flags span { position:relative; display:block; width:20px; line-height:2px; font-size:0%; font-weight:normal; } #flags span { position:absolute; top:0; left:0; width:-6px; height:24px; background-position:0 -2px; } #flags span:hover { box-shadow:#eef 0 0 0px; } #amer { background-image:url(americanflag.gif); } #design { position:relative; font-size:50px; color:#7fff00; text-align:center;}#copyright { position:absolute; top:40px; right:100px; font-size:10px; color:#fff;} #rot {transform:rotate(-30deg);-ms-transform:rotate(-30deg); /* IE 9 */-moz-transform:rotate(-30deg); /* Firefox */-webkit-transform:rotate(-30deg); /* Safari and Chrome */-o-transform:rotate(-30deg); /* Opera */}

Link to comment
Share on other sites

Validate, you know we talked about this endless times, your html is absolutely #@;? as usual, for once in your life take note of what we tell you to do, AND DO IT!
Oops, forgotten! (thanks!)However, validating is simple! Not the answer to my questions and those I haven't! Edited by eduardlid
Link to comment
Share on other sites

yes! so simple and yet you forget it time after time, trouble is with the code you have now, any help we give, we end up going round and round in circles, as usual. And yes is could have been the answer to your question, as you would have fully corrected code to work with, any if you actually tired to do the work yourself (unlikely but here's hoping) you would found it would have worked now!

Edited by dsonesuk
Link to comment
Share on other sites

yes! so simple and yet you forget it time after time, trouble is with the code you have now, any help we give, we end up going round and round in circles, as usual. And yes is could have been the answer to your question, as you would have fully corrected code to work with, any if you actually tired to do the work yourself (unlikely but here's hoping) you would found it would have worked now!
File fully validated! Answer please? <!DOCTYPE html> <html> <head><link rel="stylesheet" type="text/css" href="ex1.css"><title>Eduard Lid</title></head> <body> <div id="container"><p id="name">Eduard Lid</p><ul id="flags"> <li><a href="#">us<span id="amer"></span></a></li> <li><a href="#">es<span id="spanish"></span></a></li> </ul></div> <div id="main"><ul id="links"> <li><a href="american.html">more</a></li> <li><a href="spanish.html">más</a></li> </ul> </div> <div id="bottom"> <p id="design">web<br>design diseñar<span id="copyright">Copyright © 2013</span></p> <a href="http://ar.linkedin.com/in/eduardlid"> <img id="rot" src="http://www.linkedin.com/img/webpromo/btn_viewmy_120x33_es_ES.png?locale=" alt="Ver el perfil de Eduard Lid en LinkedIn"/>* Rotate div */ </a> </div> </body></html>
Link to comment
Share on other sites

It would be useful if you create a temporary page on your website using the new code. I can test all of this on my computer, but without the images, I cannot test it properly.
Thanks!
Link to comment
Share on other sites

It would be useful if you create a temporary page on your website using the new code. I can test all of this on my computer, but without the images, I cannot test it properly.
My website now is on line: www.website2013.site50.net Edited by eduardlid
Link to comment
Share on other sites

I see big changes. There are still a few errors in your HTML. The validator gets confused on line 38. /* comment */ is not correct comment syntax for HTML. This is: <!-- comment -->

Edited by Deirdre's Dad
Link to comment
Share on other sites

I see big changes. There are still a few errors in your HTML. The validator gets confused on line 38. /* comment */ is not correct comment syntax for HTML. This is: <!-- comment -->
I've gotten a reply that this website isn't safe! How can I free test that? and on-line this website works, off-line it doesn't! How do I make it works off-line also? (I use Google Chrome)
Link to comment
Share on other sites

Online or offline, there are still 6 important errors and one small one. I see no reason to think your website is unsafe. Maybe someone is trying to scam you? Exactly what doesn't work when the site is offline?

Link to comment
Share on other sites

Online or offline, there are still 6 important errors and one small one. I see no reason to think your website is unsafe. Maybe someone is trying to scam you?Exactly what doesn't work when the site is offline?
Thanks!What doesn't work is that my html doc. doesn't link to my external css style sheet! I assume that the path is wrong, but how do I determine that?
Link to comment
Share on other sites

The browser is looking for ex1.css in the same directory where your index file is. That should be easy to verify.
The file is fully validated, but now it doesn't open as html file! <!DOCTYPE html> <html> <head><link rel="stylesheet" type="text/css" href="ex1.css"><title>Eduard Lid</title></head> <body> <div id="container"><p id="name">Eduard Lid</p><ul id="flags"><li><a href="#">us<span id="amer"></span></a></li><li><a href="#">es<span id="spanish"></span></a></li></ul></div> <div id="main"><ul id="links"><li><a href="american.html">more</a></li><li><a href="spanish.html">más</a></li></ul> </div> <div id="bottom"> <p id="design">web<br>design diseñar<span id="copyright">Copyright © 2013</span></p> <a href="http://ar.linkedin.com/in/eduardlid"> <img id="rot" src="http://www.linkedin.com/img/webpromo/btn_viewmy_120x33_es_ES.png?locale=" alt="Ver el perfil de Eduard Lid en LinkedIn"/>* Rotate div */ </a> </div> </body></html>
Link to comment
Share on other sites

it doesn't open as html file!
I don't know what you mean. It opens as HTML for me. Are you trying to open it by double-clicking? That proves nothing. Did you really stop using &entities; for your special characters? You still need to fix the Rotate Div comment, unless you want it to be visible.
Link to comment
Share on other sites

I don't know what you mean. It opens as HTML for me. Are you trying to open it by double-clicking? That proves nothing. Did you really stop using &entities; for your special characters? You still need to fix the Rotate Div comment, unless you want it to be visible.
Ok, thanks!
Link to comment
Share on other sites

Your whole page is now black, so I don't understand the first part of your question. As to the flags, did you try using <img> tags before the words design and disenador?
I mean white and black between the borders and concerning the flags I'll try later today!
Link to comment
Share on other sites

The problem was - I had this before - if I save files with Word it doesn't work! If I save them with Notepad it works!

Link to comment
Share on other sites

I think! what he wants, now don't take it as a fact as I'm guessing here, and if I'm right! I honestly can't figure out why he could not do it! HA what am i saying haha, anyhow he wants #main background to be WHITE. Also you missed a bit of important info from bottom of page "Web Development by the forum of w3schools.invisionzone.com, who utterly disassociate themselves from the Web Design aspect of this Site"

Link to comment
Share on other sites

I think! what he wants, now don't take it as a fact as I'm guessing here, and if I'm right! I honestly can't figure out why he could not do it! HA what am i saying haha, anyhow he wants #main background to be WHITE. Also you missed a bit of important info from bottom of page "Web Development by the forum of w3schools.invisionzone.com, who utterly disassociate themselves from the Web Design aspect of this Site"
After reading this I am awake (better than my alarm!)
Link to comment
Share on other sites

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 account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...