Friday 15 January 2010

css - TB fluid div alignment issue from hyde generated code -


I have the following, who is suffering from alignment issues, but I'm not sure who to solve the problem Some element should aim.

In the link, adjusting the width produces a responsive layout, but the list of blog posts is not flown in the proper alignment.

The following code from Hyde Static Site Generator is unnecessary ; & Lt; P & gt; To tag , I'm not sure whether it needs to be removed from there or if some CSS adjustment will be sufficient. <%> "% 1" from% {"Base.j2"%} {% increase in "macros.j2" from render_excerpt reference%} {% block main%} {% block page_title%} < L1 class = "title" & gt; & Lt; / H1> & Lt; Div class = "page-header" & gt; & Lt; H1 & gt; {{Resource.meta.title}} & lt; / H1> & Lt; / Div & gt; {% Endblock%} & lt; Div class = "row-fluid" & gt; View as resource.node.walk_resources_sorted_by_time ()%} {% res.url post%} in {% Res & lt; Div class = "span4" & gt; & Lt; A href = "{{content_url (res.url)}}" & gt; & Lt; H2 & gt; {{Res.meta.title}} & lt; / H2 & gt; & Lt; / A & gt; & Lt; A href = "{{content_url (res.url)}}" class = "postpick" & gt; {{Post.image | Markdown | Typography}} & lt; / A & gt; {{Res.meta.excerpt | Markdown | Typogrify}} & lt; P & gt; & Lt; One class = "btn" href = "{{content_url (res.url)}}" & gt; View details & amp; Raquo; & Lt; / A & gt; & Lt; / P & gt; & Lt; / Div & gt; & Lt ;! - / span - & gt; {% Endfor%} & lt; / Div & gt; & Lt ;! - / row - & gt; {% Endblock%}

If you want to create a grid then the best For every 3 Span4 you generate a new line-fluid below the second example:

  & lt; Div class = "row-fluid" & gt; & Lt; Div class = "span12" & gt; // These two lines are our flexible containers / this structure with your code posted every 3/ div; Div class = "row-fluid" & gt; & Lt; Div class = "span 4" & gt; & Lt; / Div & gt; & Lt; Div class = "span 4" & gt; & Lt; / Div & gt; & Lt; Div class = "span 4" & gt; & Lt; / Div & gt; & Lt; / Div & gt;   

I use php to do this, but I think that there is a small error in the logical structure of my html in the circle!

No comments:

Post a Comment