Condor Man Posted May 17, 2009 Share Posted May 17, 2009 Does anybody know if it's at all possible to set the width on a <span>? I've read that it is possible and I could set margin and padding as well BUT I wont notice any effect until I position the element. I'm also assured that this would be XHTML valid. Could anybody actually confirm that I can can set the width,it would be valid and finally show me how to do. Thanks in advance. Link to comment Share on other sites More sharing options...
Ingolme Posted May 17, 2009 Share Posted May 17, 2009 You can set the width of a span element if you change its display to block, but I'd have to ask why you want to assign a width to a <span> element. Link to comment Share on other sites More sharing options...
Condor Man Posted May 17, 2009 Author Share Posted May 17, 2009 You can set the width of a span element if you change its display to block, but I'd have to ask why you want to assign a width to a <span> element.I'm trying to write a valid XHTML on line CV styled using CSS and I need to add space between my <span id="companyname">, <span id="jobtitle"> and <span id="date">.I figured that the best way of doing this would be to fix the width of the three spans? but I'm open to suggestion if there is a more elegant solution.I used a table to solve this problem in a previous incarnation of my site but i'd rather avoid tables if at all possible and I'm determined to write a W3C validated version.PLEASE HELP. Link to comment Share on other sites More sharing options...
Ingolme Posted May 17, 2009 Share Posted May 17, 2009 In order to give a good answer to your question, I'd need to know how you want your site to look. Link to comment Share on other sites More sharing options...
jlhaslip Posted May 17, 2009 Share Posted May 17, 2009 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"><html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <meta http-equiv="Description" content="File Description" /> <meta http-equiv="Author" content="jlhaslip, jlhaslip@yahoo.ca" /> <meta http-equiv="Title" content="Sample Margins Page" /> <meta http-equiv="Expires" content="never" /> <meta http-equiv="Keywords" content="list the page keywords here" /> <!-- <link href="style.css" rel="stylesheet" type="text/css" media="screen" /> --> <!-- <link href="print_style.css" rel="stylesheet" type="text/css" media="print" /> --> <title> Check for collapsing margins </title> <style type="text/css"> * { margin: 0; padding: 0; } body { background-color: #0ff; height: 100%; } p { margin: 5em 10em; padding: .15em; background-color: #fcc; border: 2px dotted green; } p.less { margin: 1em; border: 1px solid red; } /*]]>*/ </style> </head><!-- --> <body> <div id="header"> </div> <div id = "content"> <p>This paragraph has margin: margin: 5em 10em; padding: .15em; </p> <p class="less">This paragraph has: margin: 10px;, but they collapse into the 50px top/bottom margins of the other paragraphs. </p> <p>This paragraph has margin: margin: 5em 10em; padding: .15em; </p> <p><span>these spans have</span><span>no margins.</span> <p><span>these spans have</span><span style="margin-left: 3em; border: 1px solid;" >margin-left 3em on the second span.</span> <p><span style="margin-right: 3em; border: 1px solid;" >these spans have</span><span >margin-right 3em on the first span.</span> <p><span style="margin-left: 3em; border: 1px solid;" >these spans have</span><span style="margin-left: 3em; border: 1px solid;" >margin-left 3em on both spans.</span> <p>And no display:block, no floats (floating gives the element display:block)</p. </div> </body></html> Link to comment Share on other sites More sharing options...
Ingolme Posted May 17, 2009 Share Posted May 17, 2009 To jlhaslip:The question isn't whether it's possible add space to the left or right of the span, it's if there could be more appropriate elements in the place. In order to find out, I'd need to know how the page is supposed to be structured. Link to comment Share on other sites More sharing options...
chibineku Posted May 17, 2009 Share Posted May 17, 2009 To jlhaslip:The question isn't whether it's possible add space to the left or right of the span, it's if there could be more appropriate elements in the place. In order to find out, I'd need to know how the page is supposed to be structured.As always, the quality of the help on this forum is exceptional: you can expect to get not only a solution to your current problem, but advice above and beyond the call of duty to investigate better, more fundamental solutions. Link to comment Share on other sites More sharing options...
jlhaslip Posted May 18, 2009 Share Posted May 18, 2009 I'm trying to write a valid XHTML on line CV styled using CSS and I need to add space between my <span id="companyname">, <span id="jobtitle"> and <span id="date">.I was simply answering the posted question. I do not argue that 'semantics' is important. It is.Is a span tag the correct tag to use? I don't know. The page creator 'should' post the code for us to know investigate whether there might be another tag to use which is more 'semantic' and proper, but in light of the question given, and the tools available, the margin reply should work.They did not request equally spaced text (which is doable, but not with spans, at least without positioning as they point out), or ask about the semantics involved, so I answered with a solution which should work, given the information at hand. That in no way be-littles your request for more code. As an aside, check out the HTML code for an hCard format. Spans are used exactly as per the original poster's request. I doubt very much if the Developers of the hCard formats would use non-semantic coding. Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.