eduard Posted August 16, 2011 Share Posted August 16, 2011 How do I get more than 1 space between words in a text and how do I get to the next line without using <br/>? Link to comment Share on other sites More sharing options...
Ingolme Posted August 16, 2011 Share Posted August 16, 2011 A line break follows any block level element, such as <p> or <div>. <p>This is a sentence followed by a line break.</p><p>This is another sentence.</p> I don't see a good reason to add extra spaces between words. You should use padding and margins on elements to give space. In the rare case that you need spaces between words you can use the non-breaking space. Word1 Word2 Link to comment Share on other sites More sharing options...
eduard Posted August 16, 2011 Author Share Posted August 16, 2011 A line break follows any block level element, such as <p> or <div>.<p>This is a sentence followed by a line break.</p><p>This is another sentence.</p> I don't see a good reason to add extra spaces between words. You should use padding and margins on elements to give space. In the rare case that you need spaces between words you can use the non-breaking space. Word1 Word2 Still a question; If you see thee text in the middle of the 2nd div of the homepage of my website www.eduardlid.com, how do I get: webdesignxxxxxxxxxxxxxxxdiseno sitios web (next line!) databasxxxxxxxxxxxxxxxxxbase de datos x = space Link to comment Share on other sites More sharing options...
Drycodez Posted August 16, 2011 Share Posted August 16, 2011 webdesignxxxxxxxxxxxxxxxdiseno sitios web TEXT WITH SPACES:databas base de datos x= Link to comment Share on other sites More sharing options...
dsonesuk Posted August 16, 2011 Share Posted August 16, 2011 As mentioned just use MARGIN with a span<p class="spaceme">webdesign<span>diseno sitios web</span></p><p class="spaceme">databa<span>base de datos</span></p>.spaceme span {margin-left: 7.5ex;} /*0.5ex = 1 space approx*/ Link to comment Share on other sites More sharing options...
eduard Posted August 16, 2011 Author Share Posted August 16, 2011 webdesignxxxxxxxxxxxxxxxdiseno sitios web TEXT WITH SPACES:databas base de datos x= Thanks! Link to comment Share on other sites More sharing options...
eduard Posted August 16, 2011 Author Share Posted August 16, 2011 As mentioned just use MARGIN with a span<p class="spaceme">webdesign<span>diseno sitios web</span></p><p class="spaceme">databa<span>base de datos</span></p>.spaceme span {margin-left: 7.5ex;} /*0.5ex = 1 space approx*/Thanks! Link to comment Share on other sites More sharing options...
eduard Posted August 16, 2011 Author Share Posted August 16, 2011 As mentioned just use MARGIN with a span<p class="spaceme">webdesign<span>diseno sitios web</span></p><p class="spaceme">databa<span>base de datos</span></p>.spaceme span {margin-left: 7.5ex;} /*0.5ex = 1 space approx*/I don´t understand the ultimate line! Where can I find more about it? Link to comment Share on other sites More sharing options...
thescientist Posted August 16, 2011 Share Posted August 16, 2011 ultimate line? could you specify the line in question directly so we can help you?His code snippet is nothing you haven't been told before. He is just using a very specific CSS selector, to target <span>'s that are children of an element with a classname of 'spaceme'. Link to comment Share on other sites More sharing options...
dsonesuk Posted August 16, 2011 Share Posted August 16, 2011 http://www.w3schools.com/tags/tag_span.aspGives example on changing text color using span, all you are doing is assigning a margin to a span within a paragraph, with class name 'spaceme' ONLY. So it won't affect any other paragraphs within the page.http://w3schools.com/css/css_id_class.asphttp://w3schools.com/css/css_margin.asp Link to comment Share on other sites More sharing options...
eduard Posted August 16, 2011 Author Share Posted August 16, 2011 As mentioned just use MARGIN with a span<p class="spaceme">webdesign<span>diseno sitios web</span></p><p class="spaceme">databa<span>base de datos</span></p>.spaceme span {margin-left: 7.5ex;} /*0.5ex = 1 space approx*/I did it and it worked, but by doing this my image moved!How can I avoid this?And do you know how I get the spanish n (nn)? Link to comment Share on other sites More sharing options...
SillyBilly Posted August 16, 2011 Share Posted August 16, 2011 And do you know how I get the spanish n (nn)?In HTML character entity reference the codes are Ñ and ñ or "apersand symbol, number symbol, 209" with no spaces; or ampersand symbol, number symbol, 241" with no spaces. Link to comment Share on other sites More sharing options...
eduard Posted August 16, 2011 Author Share Posted August 16, 2011 In HTML character entity reference the codes are Ñ and ñ or "apersand symbol, number symbol, 209" with no spaces; or ampersand symbol, number symbol, 241" with no spaces.Thanks! Link to comment Share on other sites More sharing options...
eduard Posted August 17, 2011 Author Share Posted August 17, 2011 As mentioned just use MARGIN with a span<p class="spaceme">webdesign<span>diseno sitios web</span></p><p class="spaceme">databa<span>base de datos</span></p>.spaceme span {margin-left: 7.5ex;} /*0.5ex = 1 space approx*/How do I set for each Line a different "spaceme"? Link to comment Share on other sites More sharing options...
dsonesuk Posted August 18, 2011 Share Posted August 18, 2011 ???new class name for paragraph with different margin setting for span. Link to comment Share on other sites More sharing options...
eduard Posted August 18, 2011 Author Share Posted August 18, 2011 ???new class name for paragraph with different margin setting for span.Thanks! Link to comment Share on other sites More sharing options...
eduard Posted August 18, 2011 Author Share Posted August 18, 2011 ???new class name for paragraph with different margin setting for span.This I don´t understand:<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN""http://www.w3.org/TR/html4/strict.dtd"><HTML><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="header"><a href="http://www.viadeo.com/es/profile/eduard.lid"><b><h4>Profile</h4></b></a><a href="web_designer/image_and_text_database.html"><b><h4>Web designer</h4></b></a></div><div class="english spanish"><a href="versions/english/image_and_text_database.html"><img src="http://3.bp.blogspot.com/_cIPQ-HCqBAg/TAKoVdt59AI/AAAAAAAAAK4/fvqQE-B5g0w/s1600/english+flag.gif" alt="english" class="english"></a><a href="versions/espanol/base_de_datos.html"><img src="http://www.enchantedlearning.com/europe/spain/flag/Flagbig.GIF" alt="spanish" class="spanish"></a></div><div id="content"><img width="320" height="256" align="left" style="border-right:2px solid grey" src="http://www.aquaculture.ugent.be/_img/database.jpg" id="dbimg" alt="img database"><img width="320" height="256" align="right" style="border-left: 2px solid grey; float: right;" src="images/me.JPG" alt="Eduard Lid"><p class="webdesign">webdesign<span>diseño sitios web</span></p><p class="database">database<span>base de datos</span></p><p class="spaceme">translator<span>traductor</span></p><p class="spaceme">spanish german dutch<span>inglés alemán holandés</span></p><br><br><br><br><br><br><br><br><br><h3 style="text-align:center;">Eduard Lid</h3></div><div id="footer"></div></body></HTML>*{margin:0px;padding:0px;}#header{border-style:solid;border-width:0px;border-color:#808080;content:100%;background-color:#6495ED;height:12em;}a:link,a:visited{border-bottom-style:solid;border-color:#808080;color:#6A5ACD;text-decoration:none;display:block;background-color:#A9A9A9;width:120px;height:20%;text-align:center;padding:2px;}a:hover,a:activeh{background-color:#000000;}body{background-color:#6495ED;}.english{background-color:#6495ED;border-style:solid;border-width:0px;text-decoration:none;display:block;border-width:2px;width:120px;height:80%;}{a:hover,a:activebackground-color:#6495ED;}.spanish{background-color:#6495ED;border-style:solid;border-width:2px;text-decoration:none;display:block;border-width:0px;width:120px;height:80%;}{a:hover,a:activebackground-color:#6495ED;}#content{background-color:#ffffff;border-style:solid;border-color:#808080;height:256px;border-width:2px;}.webdesign span{margin-left:7.5ex;}.database span{margin-left:15ex;}#footer{background-color:#6495ED;border-style:solid;border-color:#808080;border-width:2px;height:7em;font-family:Arial,Helvetica,sans-serif;line-height:90%;font-size:40px;color:#000000;} Link to comment Share on other sites More sharing options...
dsonesuk Posted August 18, 2011 Share Posted August 18, 2011 UUUUUUHHHHH! What about? the 'meaning of life' well that's a hard one to crack, or something specific about the above code, details about your problem would help. Link to comment Share on other sites More sharing options...
eduard Posted August 18, 2011 Author Share Posted August 18, 2011 UUUUUUHHHHH! What about? the 'meaning of life' well that's a hard one to crack, or something specific about the above code, details about your problem would help.I replied to your previous post (different number of spaces) and I don´t understand your reply (I tried it, but it doesn´t work?) Link to comment Share on other sites More sharing options...
thescientist Posted August 18, 2011 Share Posted August 18, 2011 I replied to your previous post (different number of spaces) and I don´t understand your reply (I tried it, but it doesn´t work?)what don't you understand? What did you try? Your code didn't look like you changed anything. What don't you get about making a new class with different margins for the other span? Link to comment Share on other sites More sharing options...
eduard Posted August 18, 2011 Author Share Posted August 18, 2011 This I tried, but it didn´t work!<p class="webdesign">webdesign<span>diseño sitios web</span></p><p class="database">database<span>base de datos</span></p>.spaceme span (I tried .webdesign span){margin-left:7.5ex;} Link to comment Share on other sites More sharing options...
dsonesuk Posted August 18, 2011 Share Posted August 18, 2011 This I tried, but it didn´t work!<p class="webdesign">webdesign<span>diseño sitios web</span></p><p class="database">database<span>base de datos</span></p>.spaceme span (I tried .webdesign span){margin-left:7.5ex;}but it does work? if you replace '.spaceme span' with '.webdesign span', the paragraph with class 'webdesign' will have the spacing that .spaceme span used to have. Link to comment Share on other sites More sharing options...
eduard Posted August 18, 2011 Author Share Posted August 18, 2011 but it does work? if you replace '.spaceme span' with '.webdesign span', the paragraph with class 'webdesign' will have the spacing that .spaceme span used to have.Yes, it works! My question wasn´t good!I want a variable space e. g. webdesignxxxxxxxxxxxdiseno sitios web databasexxxxxxxxxxxxbase de datos (english) (spanish) Link to comment Share on other sites More sharing options...
dsonesuk Posted August 19, 2011 Share Posted August 19, 2011 then using .database span{margin-left:15ex;}Will work also, it will double the space you used for webdesign paragraph, because you have doubled the value, if it too large a space!.. well here's an idea, TRY reducing the value. I explained to you that 0.5 ex equals a space approximately in post#5. Link to comment Share on other sites More sharing options...
eduard Posted August 22, 2011 Author Share Posted August 22, 2011 then using .database span{margin-left:15ex;}Will work also, it will double the space you used for webdesign paragraph, because you have doubled the value, if it too large a space!.. well here's an idea, TRY reducing the value. I explained to you that 0.5 ex equals a space approximately in post#5.I don´t understand it good! I want the english text (webdesign, database, translator) on the left side of the paragraph and the spanish text (diseno sitios web, base de datos, traductor) on the right side. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.