All Questions
23 questions
-1
votes
1
answer
75
views
Bootstrap card component [closed]
I am using Bootstrap v5.3 to create a card layout, and I want it to be SEO-friendly (see this link for my SEO-friendly criteria).
Below is my card component I wish to optimize and, if possible, to ...
4
votes
1
answer
5k
views
Randomly place Divs on webpage and make sure they don't overlap
Currently I am working on a project for which I want to have the different links (div elements) placed randomly on my webpage. To accomplish this, I first generate a set of coordinates and later check ...
3
votes
1
answer
229
views
Text centered in a circular component
I have surrounded my initials with a circle. This is intended to be a re-usable component in a responsive layout. (When it is re-used the text will always be two letters, and the font won't change. It ...
1
vote
1
answer
235
views
blueBox dashboard Dribble design challenge
I have coded an UI from dribble design as a challenge and completed it but I think The CSS I wrote is really bad. I am a beginner. How can I improve my CSS?. One of the main problems is that I am ...
6
votes
2
answers
105
views
Position logo in middle of nav
I've recently migrated away from floats and have started using flexbox to build my grids.
My navigation has 4 menu items. I'd like my logo to sit in the middle of these. To maintain a good page ...
6
votes
1
answer
90
views
Ultra-simple, automatic, non-float, 1-4 column, grid system
Has everyone moved over to CSS Grid and/or Flexbox? If not, I've maintained and evolved this system over a fair amount of time, the concept was derived originally, I believe, from Mary Lou, although I ...
4
votes
3
answers
108
views
Breaking group of items into rows then ensure consistent height of each row element
I'm working on a product category page where the product images have inconsistent heights so I've been asked to improve the page appearance without changing the images.
The page contains x number of ...
0
votes
1
answer
52
views
Large poster with positioning elements
Ignoring the text inside, what is there to be improved?
This is supposed to be a poster for my Food Technology homework, but after getting some review from the informational side, I'd like some ...
2
votes
2
answers
1k
views
RTL management HTML & CSS
I've been working around a solution to easily manage LTR and RTL on the same interface.
The different solutions I knew at first:
Override CSS according to direction.
Use a program to transform your ...
5
votes
1
answer
94
views
Flexbox layout, columns, rows, multiple heights
I wanted everything to just snap into place, but found I had to add spacing to some of the items in order to line them up. It's still neater than trying to float things, and Grid isn't ready yet. But ...
7
votes
1
answer
10k
views
HTML form using <table> or <div>
I read that, in HTML, it is better to display non-tabular data using the <div> tag instead of the <table> tag. I ...
7
votes
1
answer
120
views
Positioning a container next to its menu
I'm a beginner in CSS and need help with a suggestion.
I'm working on a project, in which I managed to position container_main right next to ...
4
votes
1
answer
188
views
Responsive video embedding
I figured out a alternative way to make embedded videos responsive and I like to have some feedback on it.
Would this be considered a hack or just bad coding to add a extra piece of html to make this ...
0
votes
1
answer
49
views
File listing layout
I am designing a very basic file listing layout in HTML and CSS. Although its working but I would like to know if the following code could be improved upon so that its more good and follows the best ...
3
votes
1
answer
122
views
HTML and CSS template of "Free .psd layout"
I have coded a free .psd layout for the first time. I did not make it responive because I would like to know if the code is correct.
The layout's appearance in Firefox and Chrome seems to be ok (...
3
votes
1
answer
307
views
CSS flexbox responsive grid system
I'm using the flexbox for the first time for a responsive grid system. It seems to be working as far as I tested but want to make sure it works on others too and see ways to improve this.
Please see <...
1
vote
1
answer
56
views
Product information overlaid on a large image
I've created some full-width divs containing images and text to exposure products.
It did take a lot of trial and error (I do not have any kind of education).
However, it feels a bit clumsy and i'm ...
1
vote
1
answer
2k
views
Udacity Intro to HTML and CSS layout sample
I'm going through the Udacity Intro to HTML and CSS course at the moment, and one of the exercises is to convert this mockup to HTML and CSS.
I did the following, and it looks ok-ish:
HTML:
...
3
votes
1
answer
653
views
HTML and CSS markup for flexible form layout
I'm trying to have a HTML / CSS structure for flexible layouts for forms. I tried to look at Bootstrap codes for help with this (without actually using Bootstrap itself). I've gone with something ...
5
votes
1
answer
558
views
Vertical-align in Nested Column
Requirements:
There are two columns. The left column is fixed width.
The height of two Column should be the same.
Left column contain a title (can be multi-line) and an Image (limit max width to ...
4
votes
1
answer
424
views
Am I over using <ul> for layout?
I want to create a small web widget, you can see it at this jsfiddle. Right now it is organized by placing lists within lists and content within those lists. All of this is supposed to sit, as a bar, ...
4
votes
1
answer
134
views
Webpage Template
Introduction
I am designing a website as a hobby. As you can probably tell from the code below, I am an absolute beginner. The first thing I'd like to do is to create a nice webpage template that I ...
2
votes
1
answer
613
views
HTML - single page layout - absolute positioning
I am doing web apps, mostly single page apps. So i have to give absolute and fixed positioning a lot via css.
For Example, consider this page layout:
...